文件指纹
给文件设置hash值,每次打包构建的时候如果文件发生了改变,那么其对应的hash值改变,其余的文件不会改变。这样的话有利于浏览器使用旧的缓存文件。
对js文件会使用chunkhash,chunkhash是无法在热更新的时候使用,因此将webpack分成webpack.prod.js和webpack.dev.js 并修改命令
对css使用contenthash
CSS文件指纹配置和JS文件指纹配置:
1. npm i mini-css-extract-plugin -D
2.style-loader是把样式插入到style标签内 插入头部,而cssextractplugin是提取css并按需加载,二者是互斥的。因此想要用css文件指纹就必须删掉style-loader,最终配置如下
图片文件指纹配置:
测试结果: