webpack chunkhash
- 错误
output: {
filename: '[name].[chunkhash ].js',
path: path.resolve(__dirname, buildDir)
}
编译不了
- 为什么用chunkhash
使用hash对js和css进行签名时,每一次hash值都不一样,导致无法利用缓存,原因是因为,hash字段是根据每次编译compilation的内容计算所得,也可以理解为项目总体文件的hash值,而不是针对每个具体文件的。而用chunkhash,每一个js的模块对应的值是不同的(根据js里的不同内容进行生成),所以在项目中所有的文件都准备用chunkhash,但是又有了新的问题-img和font等资源中,使用chunkhash会报错 - 解决:因为chunkhash只适用于js和css,img中是没有这种东西的。分别设置处理filename
output: {
filename: '[name].[hash].js',
path: path.resolve(__dirname, buildDir)
},
plugins:[
//保证不管再添加任何新的本地依赖,对于每次构建,vendor hash 都应该保持一致
new webpack.HashedModuleIdsPlugin(),
//js
new webpack.optimize.CommonsChunkPlugin({
name: "vendor" ,
filename:"[name].[chunkhash].js"
}),
//css
new ExtractTextPlugin("[name].[chunkhash].css")
]