1.js文件 多入口配置:
在公共配置中配置多入口
[webpack.common.js]:
entry: {
index: path.join(srcPath, 'index.js'),
other: path.join(srcPath, 'other.js')
},
生產(chǎn)環(huán)境配置多出口
[webpack.prod.js]:
output: {
// filename: 'bundle.[contentHash:8].js', // 單入口配置打包代碼時央星,加上 hash 戳
filename: '[name].[contentHash:8].js', // name 即多入口時 entry 的 key :index 眯分、other
path: distPath,
},
2.生成多個html文件
針對上述配置的多入口js文件贸铜,分別生成多個html文件
在公共配置中配置:
[webpack.common.js]:
plugins: [
//單入口時 生成index.html
// new HtmlWebpackPlugin({
// template: path.join(srcPath, 'index.html'),
// filename: 'index.html'
// })
// 多入口 - 生成 index.html
new HtmlWebpackPlugin({
template: path.join(srcPath, 'index.html'),
filename: 'index.html',
// chunks 表示該頁面要引用哪些 chunk (即上面的 index 和 other)空骚,默認全部引用
chunks: ['index'] // 只引用 index.js
}),
// 多入口 - 生成 other.html
new HtmlWebpackPlugin({
template: path.join(srcPath, 'other.html'),
filename: 'other.html',
chunks: ['other'] // 只引用 other.js
})
]