background
Persistence cache can be regarded as one of the most exciting features of Webpack 5. It can persist the first build result to the local file system and skip a series of very performance-consuming operations such as parsing, linking, and compilation the next time the build is performed. , directly reuse the construction results of module and chunk.
cache will be set in development mode type: 'memory'
and disabled in production mode. cache: true
It has the same effect as cache: { type: 'memory' }
configuration. Passing false disables caching:
Common configuration
cache.type
Cache type, supported 'memory' | 'filesystem'
, filesystem needs to be set to enable persistent cache.
When cache.type is set to 'filesystem', more configurable items will be opened.
cache.cacheDirectory
The path where cache files are stored, the default isnode_modules/.cache/webpack
cache.buildDependencies
Additional dependency files. When the contents of these files change, the cache will be completely invalidated and a complete compilation and build will be performed. This can usually be set as a project configuration file, such as:
module.exports = {
cache: {
buildDependencies: {
config: [path.join(__dirname, 'webpack.dll_config.js')],
},
},
};
The official recommendations are:
module.exports = {
cache: {
buildDependencies: {
// This makes all dependencies of this file - build dependencies
config: [__filename],
// 默认情况下 webpack 与 loader 是构建依赖。
},
},
};
In other words, if the current webpack configuration file does not change, the cache will always be used.