webpack配置信息
entry: {
Home:'./src/index', //文件入口1
Footer:'./src/_index' //文件入口2
},
output: {
path: path.join(__dirname, 'dist'),
filename: '[name].js', //打包生成之后的名字
chunkFileName: '[name].js', //打包生成之后的名字
publicPath: './dist/' //代码生成在和webpack平级的dist目录下
},
plugins: [
.......
new webpack.optimize.CommonsChunkPlugin({
name:'common', //提取公共代码文件名
chunks:['Home','Footer'], //只提取main节点和index节点,不设置提取所有文件公共部分代码
minChunks:2 // 最少被多少个文件公共才会被提取
})
......
]
引用时应按照entry部分顺序引用js代码
上例中入口文件先有Home后有Footer,因此html引用顺序为
- common.js
- Home.js
- Footer.js
单独使用的时候引用
文件1:
- common.js
- Home.js
文件2:
- common.js
- Footer.js