Table of contents
Chapter 1, Understanding create-vue
1.2 Create a project using create-vue
1.2.1 Creation steps and precautions
1.2.3 Familiar with the project, distinguish it from vue2
Chapter 1, Understanding create-vue
1.1 Introduction
create-vue is a new scaffolding tool on Vue's official website . The bottom layer is switched to vite (next-generation front-end tool chain) to provide rapid response for development.
1.2 Create a project using create-vue
1.2.1 Creation steps and precautions
- Node version: above 16.0.0, check the version
(Provide you with the specific operation of node version management)
- Create with command: npm init vue@latest
npm init vue@latest(Note here, the prompt needs to download the corresponding version, just select y to download)
- Understand and configure options (the first time you create a vue3 project, follow the configuration below)
- When the creation is complete, a notice will pop up: (if not, just ignore it)
Here we can update the version, use the command: npm install -g [email protected]
npm install -g [email protected]
Check version:
- After confirming that there is no problem with the above:
Enter the project, initialize the project, run the project
- After running the project, click on the path
When the following page appears, it means the creation is successful:
1.2.2 Precautions
- Prerequisite: install at least a node version higher than 16.0
- Create a Vue application: npm init vue@latest
1.2.3 Familiar with the project, distinguish it from vue2
- package.json: project package file—commands and dependencies of local projects: the core dependency becomes Vue3.x and the bottom layer of vite as the driver
- vite.config.js: project configuration file - vite-based configuration
- main.js: entry file - createApp function to create an application instance
- App.vue: root component - SFC single file component sequence script - template - style changes and the template template no longer requires a unique root element; script supports setup combined api
