close
logologo
指南
配置
插件
API
社区
版本
更新日志
Rsbuild 0.x 文档
English
简体中文
指南
配置
插件
API
社区
更新日志
Rsbuild 0.x 文档
English
简体中文
logologo
Overview
root
mode
plugins
logLevel
environments

dev

dev.assetPrefix
dev.browserLogs
dev.cliShortcuts
dev.client
dev.hmr
dev.lazyCompilation
dev.liveReload
dev.progressBar
dev.setupMiddlewares
dev.watchFiles
dev.writeToDisk

resolve

resolve.aliasStrategy
resolve.alias
resolve.conditionNames
resolve.dedupe
resolve.extensions
resolve.mainFields

source

source.assetsInclude
source.decorators
source.define
source.entry
source.exclude
source.include
source.preEntry
source.transformImport
source.tsconfigPath

output

output.assetPrefix
output.charset
output.cleanDistPath
output.copy
output.cssModules
output.dataUriLimit
output.distPath
output.emitAssets
output.emitCss
output.externals
output.filenameHash
output.filename
output.injectStyles
output.inlineScripts
output.inlineStyles
output.legalComments
output.manifest
output.minify
output.module
output.overrideBrowserslist
output.polyfill
output.sourceMap
output.target

html

html.appIcon
html.crossorigin
html.favicon
html.inject
html.meta
html.mountId
html.outputStructure
html.scriptLoading
html.tags
html.templateParameters
html.template
html.title

server

server.base
server.compress
server.cors
server.headers
server.historyApiFallback
server.host
server.htmlFallback
server.https
server.middlewareMode
server.open
server.port
server.printUrls
server.proxy
server.publicDir
server.strictPort

security

security.nonce
security.sri

tools

tools.bundlerChain
tools.cssExtract
tools.cssLoader
tools.htmlPlugin
tools.lightningcssLoader
tools.postcss
tools.rspack
tools.styleLoader
tools.swc

performance

performance.buildCache
performance.bundleAnalyze
performance.chunkSplit
performance.dnsPrefetch
performance.preconnect
performance.prefetch
performance.preload
performance.printFileSize
performance.profile
performance.removeConsole
performance.removeMomentLocale

moduleFederation

moduleFederation.options
📝 在 GitHub 上编辑此页
上一页root
下一页plugins

#mode

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

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

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

TIP

mode 的值不会影响 .env 文件的加载结果, 因为 .env 文件早于 Rsbuild 的配置文件被解析。

Rsbuild CLI 支持使用 --env-mode 选项来指定 env 模式,详见 "Env 模式"。

#默认值

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

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

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

rsbuild.config.ts
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。
  • 使用 dev.assetPrefix 的值作为静态资源的 URL 前缀。

#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。
  • 使用 output.assetPrefix 的值作为静态资源的 URL 前缀。

#None 模式

当 mode 的值为 none 时:

  • 不开启任何优化。
  • 源代码中的 process.env.NODE_ENV 不会被替换。
  • 源代码中的 import.meta.env.MODE 会被替换为 'none'。
  • 源代码中的 import.meta.env.DEV 会被替换为 false。
  • 源代码中的 import.meta.env.PROD 会被替换为 false。
  • 使用 output.assetPrefix 的值作为静态资源的 URL 前缀。