#output.overrideBrowserslist

• Type: string[]
• Default: undefined

Specifies the range of target browsers that the project is compatible with.

This value will be used by tools such as SWC and Lightning CSS to identify the JavaScript syntax that needs to be transformed and the CSS browser prefixes that need to be added.

#Priority

The overrideBrowserslist config will override the .browserslistrc config file in the project and the browserslist field in package.json.

In most cases, it is recommended to use the .browserslistrc file rather than the overrideBrowserslist config. Because the .browserslistrc file is the official config file, it is more general and can be recognized by other libraries in the community.

For more details, see Browserslist.

#Default value

If there is no browserslist configs defined in the project, nor overrideBrowserslist defined, then Rsbuild will set the default browserslist to:

['chrome >= 87', 'edge >= 88', 'firefox >= 78', 'safari >= 14'];

#Example

An example of mobile web applications:

export default {
  output: {
    overrideBrowserslist: [
      'iOS >= 9',
      'Android >= 4.4',
      'last 2 versions',
      '> 0.2%',
      'not dead',
    ],
  },
};

Check out the browserslist documentation to learn more about browserslist.

#Set by environment

When you build for multiple environments, you can set different browserslist for each environment:

For example, set different browserslist for web and node environments:

export default {
  environments: {
    web: {
      output: {
        target: 'web',
        overrideBrowserslist: ['iOS >= 9', 'Android >= 4.4'],
      },
    },
    node: {
      output: {
        target: 'node',
        overrideBrowserslist: ['node >= 20'],
      },
    },
  },
};