Browserslist support

[Aaronius]

The documentation isn't clear on whether Vite supports configuring a browserslist via package.json or .browserslistrc. It only says:

You can specify custom targets via the build.target config option, where the lowest target is es2015.

Are the conventional ways of defining browserslist supported or do we need to use build.target to specify the browserslist? BTW, I'm not trying to target legacy browsers. Thanks!

[capi1O]

I doubt it because those vite build target strings follow the esbuild target format which is different than the browserlist queries:

• esbuild target example: ['es2015', 'safari11', 'ios11']
• browserlist query example: ['defaults', 'Safari >= 11', 'ios_saf >= 11']

[Codex-]

For anyone that stumbles across this:
https://github.com/vitejs/vite/tree/main/packages/plugin-legacy#targets

The query is also Browserslist compatible. The default value, 'defaults', is what is recommended by Browserslist. See Browserslist Best Practices for more details.

[Aaronius]

The page states:

This plugin provides support for legacy browsers that do not support those features when building for production.

I'm not trying to support legacy browsers.

[kingyue737]

I use this package to pass browserslist config to esbuild target option:
https://github.com/marcofugaro/browserslist-to-esbuild

// vite.config.*
import { defineConfig } from 'vite'
import browserslistToEsbuild from 'browserslist-to-esbuild'

export default defineConfig({
  build: { target: browserslistToEsbuild() }
})

[jclaveau]

Thank you!

[meduzen]

It wasn’t clear to me neither how much of Browserslist was supported by Vite, so I did some researches on top of what you all shared and wrote an article about it.

I think Vite could leverage the browserslist-to-esbuild package to remove that (small) burden from Vite users. And it would also give Vite the ability to claim it fully supports Browserslist through the underlying tools Vite uses. Edit: an issue to consider this has been created: #11489