Skip to content
On this page

Beyond Fast

ViteConf 2023

Watch the replay!

Migration from v3

Rollup 3

Vite is now using Rollup 3, which allowed us to simplify Vite's internal asset handling and has many improvements. See the Rollup 3 release notes here.

Rollup 3 is mostly compatible with Rollup 2. If you are using custom rollupOptions in your project and encounter issues, refer to the Rollup migration guide to upgrade your config.

Modern Browser Baseline change

The modern browser build now targets safari14 by default for wider ES2020 compatibility (bumped from safari13). This means that modern builds can now use BigInt and that the nullish coalescing operator isn't transpiled anymore. If you need to support older browsers, you can add @vitejs/plugin-legacy as usual.

General Changes

Encoding

The build default charset is now utf8 (see #10753 for details).

Importing CSS as a String

In Vite 3, importing the default export of a .css file could introduce a double loading of CSS.

ts
import cssString from './global.css'

This double loading could occur since a .css file will be emitted and it's likely that the CSS string will also be used by the application code — for example, injected by the framework runtime. From Vite 4, the .css default export has been deprecated. The ?inline query suffix modifier needs to be used in this case, as that doesn't emit the imported .css styles.

ts
import stuff from './global.css?inline'

Production Builds by Default

vite build will now always build for production regardless of the --mode passed. Previously, changing mode to other than production would result in a development build. If you wish to still build for development, you can set NODE_ENV=development in the .env.{mode} file.

In part of this change, vite dev and vite build will not override process.env.NODE_ENV anymore if it is already defined. So if you've set process.env.NODE_ENV = 'development' before building, it will also build for development. This gives more control when running multiple builds or dev servers in parallel.

See the updated mode documentation for more details.

Environment Variables

Vite now uses dotenv 16 and dotenv-expand 9 (previously dotenv 14 and dotenv-expand 5). If you have a value including # or `, you will need to wrap them with quotes.

diff
-VITE_APP=ab#cd`ef
+VITE_APP="ab#cd`ef"

For more details, see the dotenv and dotenv-expand changelog.

Advanced

There are some changes which only affect plugin/tool creators.

Also there are other breaking changes which only affect few users.

Migration from v2

Check the Migration from v2 Guide in the Vite v3 docs first to see the needed changes to port your app to Vite v3, and then proceed with the changes on this page.

Released under the MIT License. (1dda64fc)