Since vite is based on ESM for modular development in the development state, and the browser compatibility version of ESM is limited, as shown in the following figure.

So, if you’re planning to use vite as a build tool for development, you need at least one suitable version of the browser. If you’re like me, the Chrome version of the browser is low, but you don’t want to upgrade, and want to keep the occasional browser compatibility issue convenient for self-testing and locating, then I recommend installing a Chromium. This way you can have two Chromes in one computer. _ No two chrome front-ends are not good front-ends [dog heads]. _

At this point, you may have another question, _What is ESM? _ On this issue, I will not expand on it here, but those who are interested can check out this article[1]. It is easy to understand that in the development state, we load modular ts or js, and after packaging, we load CommonJS, as shown below.

In addition to this, you need to upgrade your node environment to node 14 or later. And if you are also using Windows 7, this has a second question, how to install node 14 under Windows 7? You need to place the downloaded node package in the specified nvm folder with the system variable NODE_SKIP_PLATFORM_CHECK set to 1.

Component preparation: Because we want the component style to be consistent with the previous one, in order to modify the component more flexibly, we have made a simple package based on antdv[2] and released it to a private npm repository.

Components automatically introduce unplugin-vue-components

The above encapsulation also introduces another pitfall, that is, it will lead to the inability to use unplugin-vue-components. I went to mention issues that I hope to support dynamic settings of component names[3] and PR[4], which should be supported in the next version of AntDesignVueResolver.

In the actual development process, upgrading from vue2 to vue3 I think there are a few places that may need to be applied, and I also mention it here.

The Composite API is a collection of APIs that are built into Vue 3 and Vue2.7, while for older Vue 2 versions, the @vue/composition-api package is available. Composite APIs include: