close
  • English

      • mode

      • Type: 'production' | 'development' | 'none'
      • Version: >= 1.0.0

      Sets the Rsbuild build mode. Each mode applies different defaults and optimizations; for example, production minifies code by default.

      The Rsbuild mode value is also passed to Rspack's mode configuration.

      Tip

      The mode value does not change which .env file loads because .env files resolve before the Rsbuild config file.

      Use the --env-mode option in the Rsbuild CLI to specify the env mode. See "Env mode" for details.

      Default values

      The default value of mode depends on the process.env.NODE_ENV environment variable:

      • If NODE_ENV is production, the default value is production.
      • If NODE_ENV is development, the default value is development.
      • If NODE_ENV has any other value, the default value is none.

      If you set mode, the NODE_ENV value will be ignored.

      rsbuild.config.ts
      export default {
  mode: 'production',
};

      Command line

      When using the Rsbuild CLI:

      • rsbuild dev will set the default values of NODE_ENV and mode to development.
      • rsbuild build and rsbuild preview will set the default values of NODE_ENV and mode to production.

      JavaScript API

      When using the Rsbuild JavaScript API:

      Development mode

      If mode is development:

      • Enable HMR and register the HotModuleReplacementPlugin.
      • Generate JavaScript source maps, but do not generate CSS source maps. See output.sourceMap for details.
      • The process.env.NODE_ENV in the source code will be replaced with 'development'.
      • The import.meta.env.MODE in the source code will be replaced with 'development'.
      • The import.meta.env.DEV in the source code will be replaced with true.
      • The import.meta.env.PROD in the source code will be replaced with false.
      • Use dev.assetPrefix as the URL prefix for static assets.

      Production mode

      If mode is production:

      • Enable JavaScript code minification and register the SwcJsMinimizerRspackPlugin.
      • Enable CSS code minification and register the LightningCssMinimizerRspackPlugin.
      • JavaScript and CSS filenames include hash suffixes. See output.filenameHash.
      • CSS Modules class names are shorter. See cssModules.localIdentName.
      • JavaScript and CSS source maps are disabled. See output.sourceMap.
      • The process.env.NODE_ENV in the source code will be replaced with 'production'.
      • The import.meta.env.MODE in the source code will be replaced with 'production'.
      • The import.meta.env.DEV in the source code will be replaced with false.
      • The import.meta.env.PROD in the source code will be replaced with true.
      • Use output.assetPrefix as the URL prefix for static assets.

      None mode

      If mode is none:

      • Do not enable any optimizations.
      • The process.env.NODE_ENV in the source code will not be replaced.
      • The import.meta.env.MODE in the source code will be replaced with 'none'.
      • The import.meta.env.DEV in the source code will be replaced with false.
      • The import.meta.env.PROD in the source code will be replaced with false.
      • Use output.assetPrefix as the URL prefix for static assets.