boolean object
缓存生成的 webpack 模块和 chunk,来改善构建速度。cache 会在开发 模式被设置成 type: memory 而且在 生产 模式 中被禁用。 cache: true 与 cache: { type: memory } 配置作用一致。 传入 false 会禁用缓存:
webpack.config.js
module.exports = {
//...
cache: false,
};
当将 cache.type 设置为 filesystem 是会开放更多的可配置项。
收集在反序列化期间分配的未使用的内存,仅当 cache.type 设置为 filesystem 时生效。这需要将数据复制到更小的缓冲区中,并有性能成本。
webpack.config.js
module.exports = {
cache: {
type: filesystem,
allowCollectingMemory: true,
},
};
object
cache.buildDependencies 是一个针对构建的额外代码依赖的数组对象。webpack 将使用这些项和所有依赖项的哈希值来使文件系统缓存失效。
默认是 webpack/lib 来获取 webpack 的所有依赖项。
webpack.config.js
module.exports = {
cache: {
buildDependencies: {
// This makes all dependencies of this file - build dependencies
config: [__filename],
// 默认情况下 webpack 与 loader 是构建依赖。
},
},
};
string
缓存的。默认为 node_modules/.cache/webpack。
cache.cacheDirectory 选项仅当 cache.type 被设置成 filesystem 才可用。
webpack.config.js
const path = require(path);
module.exports = {
//...
cache: {
type: filesystem,
cacheDirectory: path.resolve(__dirname, .temp_cache),
},
};
string
缓存的路径。默认值为 path.resolve(cache.cacheDirectory, cache.name).
webpack.config.js
const path = require(path);
module.exports = {
//...
cache: {
type: filesystem,
cacheLocation: path.resolve(__dirname, .test_cache),
},
};
对未改变的模块进行缓存计算,只引用未改变的模块。它只能在 cache.type 值为 memory 时使用,除此之外,必须启用 experiments.cacheUnaffected 配置项。
webpack.config.js
module.exports = {
//...
cache: {
type: memory,
cacheUnaffected: true,
},
};
false | gzip | brotli
5.42.0+
用于缓存文件的压缩类型。development 模式下默认为 false,production 模式下默认为 gzip。
cache.compression 配置项仅在 cache.type 设为 filesystem 时可用。
webpack.config.js
module.exports = {
//...
cache: {
type: filesystem,
compression: gzip,
},
};
string
用于哈希生成的算法。详情请参阅 Node.js crypto。默认值为 md4.
cache.hashAlgorithm 选项仅当 cache.type 设置成 filesystem 才可配置。
webpack.config.js
module.exports = {
//...
cache: {
type: filesystem,
hashAlgorithm: md4,
},
};
number = 60000
时间以毫秒为单位。cache.idleTimeout 表示缓存存储发生的时间间隔。
cache.idleTimeout 配置项仅在 [cache.type] filesystem 时生效。
webpack.config.js
module.exports = {
//..
cache: {
type: filesystem,
idleTimeout: 60000,
},
};
number = 1000
5.41.0+
以毫秒为单位。cache.idleTimeoutAfterLargeChanges 是当检测到较大的更改时,缓存存储应在此之后发生的时间段。
cache.idleTimeoutAfterLargeChanges 仅在 cache.type 设为 filesystem 时可用。
webpack.config.js
module.exports = {
//..
cache: {
type: filesystem,
idleTimeoutAfterLargeChanges: 1000,
},
};
number = 5000
单位毫秒。 cache.idleTimeoutForInitialStore 是在初始缓存存储发生后的时间段。
cache.idleTimeoutForInitialStore 配置项仅在 [cache.type] filesystem 时生效。
webpack.config.js
module.exports = {
//..
cache: {
type: filesystem,
idleTimeoutForInitialStore: 0,
},
};
[string] = [./node_modules]
number = 5184000000
5.30.0+
允许未使用的缓存留在文件系统缓存中的时间(以毫秒为单位);默认为一个月。
cache.maxAge 仅在 cache.type 设置为 filesystem 时生效。
webpack.config.js
module.exports = {
// ...
cache: {
type: filesystem,
maxAge: 5184000000,
},
};
number
5.30.0+
定义内存缓存中未使用的缓存项的生命周期。
cache.maxGenerations 配置项仅在 cache.type 设置为 memory 时有效。
webpack.config.js
module.exports = {
// ...
cache: {
type: memory,
maxGenerations: Infinity,
},
};
number
5.30.0+
定义内存缓存中未使用的缓存项的生命周期。
cache.maxMemoryGenerations 配置项仅在 cache.type 设置为 filesystem 时有效。
webpack.config.js
module.exports = {
// ...
cache: {
type: filesystem,
maxMemoryGenerations: Infinity,
},
};
对未改变的模块进行缓存计算,并且只引用内存中未改变的模块。它只能在 cache.type 值为 filesystem 时使用,除此之外,必须启用 experiments.cacheUnaffected 配置项。
boolean
webpack.config.js
module.exports = {
//...
cache: {
type: filesystem,
memoryCacheUnaffected: true,
},
};
string
缓存的名称。不同的名字会导致不同的的共存的缓存。默认值为 ${config.name}-${config.mode}。使用 cache.name 当你有多份配置的时候,是比较合理的因为会有配置会有独立的缓存。
cache.name 选项仅当 cache.type 被设置成 filesystem 的时候可进行配置。
webpack.config.js
module.exports = {
//...
cache: {
type: filesystem,
name: AppBuildCache,
},
};
boolean = false
跟踪并记录各个 filesystem 缓存项的详细时间信息。
webpack.config.js
module.exports = {
//...
cache: {
type: filesystem,
profile: true,
},
};
string = pack: pack
cache.store 告诉 webpack 什么时候将数据存放在文件系统中。
cache.store 选项仅当 cache.type 设置成 filesystem 才可配置。
webpack.config.js
module.exports = {
//...
cache: {
type: filesystem,
store: pack,
},
};
string: memory | filesystem
将 cache 类型设置为内存或者文件系统。memory 选项很简单,它告诉 webpack 在内存中存储缓存,不允许额外的配置:
webpack.config.js
module.exports = {
//...
cache: {
type: memory,
},
};
string =
缓存数据的版本。不同版本不会允许重用缓存和重载当前的内容。当配置以一种无法重用缓存的方式改变时,要更新缓存的版本。这会让缓存失效。
cache.version 选项仅当 cache.type 设置成 filesystem 才可配置。
webpack.config.js
module.exports = {
//...
cache: {
type: filesystem,
version: your_version,
},
};
文件系统缓存允许在 CI 的构建之间共享缓存。为了设置设置缓存:
以下是一些通用配置
variables:
# 兜底使用 "main" 分支缓存,要求 GitLab Runner 版本为 13.4
CACHE_FALLBACK_KEY: main
# 这是 webpack 构建任务
build-job:
cache:
key: $CI_COMMIT_REF_SLUG # 分支/tag 名称
paths:
# 缓存文件夹
# 确保在这个任务中没有运行 "npm ci" 或者更改默认缓存文件夹
# 否则 "npm ci" 将会删除缓存文件
- node_modules/.cache/webpack/
- uses: actions/cache@v3
with:
# 缓存文件夹
path: node_modules/.cache/webpack/
key: ${{ GITHUB_REF_NAME }}-webpack-build
# 兜底使用 "main" 分支缓存
restore-keys: |
main-webpack-build