场景：
当有100个js文件，当修改了其中某一个js文件的时候，不可能再把所有的js文件再编译一遍，会影响构建速度，所以这个时候只要实现修改一个js文件只构建那一个文件，其他的99个文件不动。
那么这个时候可能会想到用热模块替换（HMR），但是HMR是基于dev-server的，生产环境是不需要dev-server。
那么这个时候可以用缓存实现。怎么配置呢？
1、针对js兼容性进行缓存：(babel缓存)
babel-loader的options设置中增加cacheDirectory属性，属性值为true。表示：开启babel缓存，第二次构建时会读取之前的缓存，构建速度会更快一点。
{
test: /\.js$/,
loader: 'babel-loader',
options: {
cacheDirectory: true
}
}
2、针对文件资源进行缓存
（1）hash：每次webpack构建时都会生成一个唯一的hash值。（不管文件有没有修改，只要构建就重新生成hash值。）
比如：filename: 'built.[hash:10].js'
缺点：因为webpack构建js和css是共用一个hash值，如果重新打包会导致所有缓存失效。（只修改js文件，那么css文件也重新构建了）
（2）chunkhash：如果打包来自同一个chunk，那么hash值就一样。
问题：js和css的hash值还是一样的
因为css是在js中被引入的，所以还是同一个hash值，同属于一个chunk.
（3）contenthash：根据文件的内容生成hash值，不同文件的hash值都不一样
缓存作用：
babel缓存：让第二次打包构建速度更快
hash缓存：让代码上线运行缓存更好使用
1795
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
