如題
應(yīng)該怎么配置才能讓html掛載對應(yīng)的js文件呢。
因為文件帶hash,沒辦法用htmlWebpackPlugin來寫死,或者有什么寫法可以解決這個問題?
人生最曼妙的風(fēng)景,竟是內(nèi)心的淡定與從容!
可不可以在plugins中定義多個HtmlWebpackPlugin, 每個Plugin中指定對應(yīng)的Chunk,如下
module.exports = {
entry: {
'page1': './apps/page1/scripts/main.js',
'page2': './apps/page2/src/main.js'
},
output: {
path: __dirname,
filename: "apps/[name]/build/bundle.js"
},
plugins: [
new HtmlWebpackPlugin({
inject: false,
chunks: ['page1'],
filename: 'apps/page1/build/index.html'
}),
new HtmlWebpackPlugin({
inject: false,
chunks: ['page2'],
filename: 'apps/page2/build/index.html'
})
]
};
樓上的做一些修改
var getHtmlConfig = function(name){
return {
template : './src/view/' + name + '.html',
filename : 'view/' + name + '.html',
inject : true,
hash : true,
chunks : ['common', name]
};
};
plugins: [
new HtmlWebpackPlugin( getHtmlConfig(name1)),
new HtmlWebpackPlugin( getHtmlConfig(name2)),
new HtmlWebpackPlugin( getHtmlConfig(name3))
]
output: {
path: './dist',
publicPath : '/dist',
filename: 'js/[name].js'
},
你把原來的文件放在src/view下面...
生產(chǎn)的文件會放在dist/'view/' + name + '.html'