Create a Vue3.0 project

1. Use vue-cli to create

Official Documentation: Creating a Project | Vue CLI (vuejs.org)

## 查看@vue/cli版本,确保@vue/cli版本在4.5.0以上
vue --version
## 安装或者升级你的@vue/cli
npm install -g @vue/cli
## 创建
vue create vue_test
## 启动
cd vue_test
npm run serve

 To use vue3, you need to ensure that the @vue/cli version is above 4.5.0

See version vue-V

  Select the Vue3 version

 then just wait

 Finish

Then 

$ cd vue3_test
 $ yarn serve 

Open the project and have a look

The length is exactly the same as Vue2 

2. Use vite to create

Official Documentation: Getting Started | Vite Official Chinese Documentation (vitejs.dev)

Vite official website: Home | Vite Chinese website (vitejs.cn)

What is vite? — A new generation of front-end build tools.
The advantages are as follows:

  • In the development environment, no packaging operation is required, and it can be cold started quickly.
  • Lightweight and fast Hot Reload (HMR).
  • True on-demand compilation, no longer waiting for the entire application to be compiled.

Comparison chart of traditional construction and vite construction

## 创建工程
npm init vite-app <project-name>
## 进入工程目录
cd <project-name>
## 安装依赖
npm install
## 运行
npm run dev

 compatibility note

Vite needs  to start | Vite official Chinese document (vitejs.dev)  version 14.18+, 16+. However, some templates require a higher version of Node to run properly. When your package manager warns you, please upgrade your version of Node.

  ​​The speed is very fast, but it actually played a trick on us. It didn't help us install the dependency package, we need to manually set it up

  ​​It should be noted here

 ​The startup

 

 

Guess you like

Origin blog.csdn.net/weixin_64612659/article/details/130165680