mode#

• 类型： 'production' | 'development' | 'none'
• 版本： >= 1.0.0

指定 Rsbuild 构建的模式，各个模式默认的行为和优化不同，比如 production 模式默认会压缩代码。

Rsbuild mode 的值也会传递给 Rspack 的 mode 配置。

默认值#

mode 的默认值取决于 process.env.NODE_ENV 环境变量：

• 如果 NODE_ENV 为 production，则默认值为 production。
• 如果 NODE_ENV 为 development，则默认值为 development。
• 如果 NODE_ENV 为其他值，则默认值为 none。

如果你设置了 mode 的值，则 NODE_ENV 的值会被忽略。

export default {
  mode: 'production',
};

命令行#

当你使用 Rsbuild 的命令行时：

• rsbuild dev 会将 NODE_ENV 和 mode 的默认值设置为 development。
• rsbuild build 和 rsbuild preview 会将 NODE_ENV 和 mode 的默认值设置为 production。

JavaScript API#

当你使用 Rsbuild 的 JavaScript API 时：

• rsbuild.startDevServer 和 rsbuild.createDevServer 会将 NODE_ENV 和 mode 的默认值设置为 development。
• rsbuild.build 和 rsbuild.preview 会将 NODE_ENV 和 mode 的默认值设置为 production。

Development 模式#

当 mode 的值为 development 时：

• 开启 HMR，注册 HotModuleReplacementPlugin。
• 生成 JavaScript 的 source map，不生成 CSS 的 source map，详见 output.sourceMap。
• 源代码中的 process.env.NODE_ENV 会被替换为 'development'。
• 源代码中的 import.meta.env.MODE 会被替换为 'development'。
• 源代码中的 import.meta.env.DEV 会被替换为 true。
• 源代码中的 import.meta.env.PROD 会被替换为 false。

Production 模式#

当 mode 的值为 production 时：

• 开启 JavaScript 代码压缩，注册 SwcJsMinimizerRspackPlugin。
• 开启 CSS 代码压缩，注册 LightningCssMinimizerRspackPlugin。
• 生成的 JavaScript 和 CSS 文件名会带有 hash 后缀，详见 output.filenameHash。
• 生成的 CSS Modules 类名更简短，详见 cssModules.localIdentName。
• 不生成 JavaScript 和 CSS 的 source map，详见 output.sourceMap。
• 源代码中的 process.env.NODE_ENV 会被替换为 'production'。
• 源代码中的 import.meta.env.MODE 会被替换为 'production'。
• 源代码中的 import.meta.env.DEV 会被替换为 false。
• 源代码中的 import.meta.env.PROD 会被替换为 true。

None 模式#

当 mode 的值为 none 时：

• 不开启任何优化。
• 源代码中的 process.env.NODE_ENV 不会被替换。
• 源代码中的 import.meta.env.MODE 会被替换为 'none'。
• 源代码中的 import.meta.env.DEV 会被替换为 false。
• 源代码中的 import.meta.env.PROD 会被替换为 false。