Vite3.0 has been released, can you still scroll (list of new features)

Some time ago, Youda released Vite 3.0 and updated the official documents of Vite. Today, Senior Ye Qiu will lead you to learn a list of new features of Vite 3.0. The following is the official document of Vite:

When I enter the homepage, I feel astonished.

This document will briefly introduce what is new in Vite 3.0, so don’t be confused.

Table of contents

1. Changes to the template

2. Optimization of Vite CLI

3. Changes in import.meta.glob API

4. Other content

Vite3.0 also updated some other content, as follows:

The overall volume of Vite becomes smaller;

JS and CSS compression tool using ESbuild (started in Vite2);

Fixed a number of bugs;

The compatibility has been adjusted, and the minimum support node14.18+;

Vite decides to release a new version every year;

1. Changes to the template

Take myself as an example, I use Vite to create the most Vue projects. After this update, the theme of the Vue template created with Vite is consistent with the Vite document , and also supports dark and light modes, and the icon is changed from Vue’s logo. It became the logo of Vite.

We can use Vite to create a Vue template and run it to see the effect:

pnpm create vite
# project name -> demo
# select a framework -> vue
# select a variant -> vue
cd demo
pnpm install
pnpm dev

The two themes are as follows

2. Optimization of Vite CLI

The style of Vite CLI in the command line has also been optimized, see the picture below

The left is Vite3.0, and the right is Vite2.0. Visually, 3.0 is obviously better than 2.0.

In addition to the appearance, we can see that the default port number has also changed , from 3000 to 5173; the address of Local has localhostchanged from 127.0.0.1.

3. Changes in import.meta.glob API

import.meta.globThe API can dynamically import files, and it is allowed to be rewritten in Vite3. For import.meta.globdetails, please refer to the Glob import form , which has been described in detail in the official documentation.

4. Other content

Vite3.0 also updated some other content, as follows:

  • The overall volume of Vite becomes smaller;

  • JS and CSS compression tool using ESbuild (started in Vite2);

  • Fixed a number of bugs;

  • The compatibility has been adjusted, and the minimum support node14.18+;

  • Vite decides to release a new version every year;

This article briefly introduces some of the new features in Vite. Xiaoyeqiu here reminds everyone: Now the speed of front-end development has become very fast, and always maintaining sensitivity to new technologies can ensure that you will not be eliminated. Come on, everyone~

Conclusion: Follow the bloggers and don’t get lost. Senior Ye Qiu will take you on the highway~~~

Leave a Comment

Your email address will not be published. Required fields are marked *