webpack 配置 chunkhash 报错

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")
]