2016-11-30 12 views
1

html-webpack-plugin 私のjsチャンクにはしか使用しません。 Bundle.cssを抽出・テキスト・プラグインによって生成されます。html-webpack-pluginによって生成されたindex.htmlからbundle.cssを除外する方法は?

new ExtractTextPlugin({filename: 'bundle.css, allChunks: true}) 

HtmlWebpackPluginオプション:

new HtmlWebpackPlugin({template: 'template/tpl.html', inject: true}) 

マイtpl.htmlは次のようになります。

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
 
    <title>Cash Management</title> 
 
    <link href="getResource?resource=build/bundle.css&mediaType=text/css" rel="stylesheet"> 
 
</head> 
 
<body> 
 
<div id='root' /> 
 
</body> 
 

 
</html>

好きなものを見たいEこれは私のindex.htmlに:

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
 
    <title>Cash Management</title> 
 
    <link href="getResource?moduleName=cm-ui&resource=build/bundle.css&mediaType=text/css" rel="stylesheet"> 
 
</head> 
 
<body> 
 
<div id='root' /> 
 
</body> 
 
    <script href="getResource?moduleName=cm-ui&resource=build/common.js" type="text/javascript"></script> 
 
    <script href="getResource?moduleName=cm-ui&resource=build/bundle.js" type="text/javascript"></script> 
 
</html>

誰かが正しい方向に私を指すしてくださいことはできますか?

+0

素早く見て、あなたのキーの「allCunks:true」の誤植を見ました。 => 'allChunks:true' –

+0

ありがとう、それを修正しました! –

答えて

1

あなたが自動的に貼り付けされているからそれらを防ぐ資産を除外することができ、それによってhtml-webpack-exclude-assets-plugin

を使用することができます。 また、lodash構文でテンプレートへのパスを挿入することもできます。

<link href="getResource?resource=<%= htmlWebpackPlugin.files.css[0] %>&mediaType=text/css" rel="stylesheet"> 
+0

良い解決策のように見えます!ありがとう! –

関連する問題