Create a project using vue CLI

From 0 to 1, use vue CLI to create a vue project and complete related configurations

---

Preface

提示：vue CLI初始化项目：

: Use vue CLI to create a vue project and complete related configurations

---

1. What is Vue CLI?

Vue CLI is a complete system for rapid development based on Vue.js. It provides:

In short, through vue CLI, you can configure the vue project graphically or choose the command line to configure the vue project.

2. Usage steps

1.Installation

Before installation, check whether nodeJS is installed. Vue CLI 4.x requires Node.js v8.9 or higher (v10 or higher is recommended). You can use nvm to manage node versions, nvm manages node

You can use the following command to install:

npm install -g @vue/cli
# OR
yarn global add @vue/cli

After the installation is complete, use it to check whether the scaffolding was installed successfully.

vue --version

To upgrade the global Vue CLI package, please run:

npm update -g @vue/cli

# 或者
yarn global upgrade --latest @vue/cli

2. Create a vue project

After installing vue CLI, you can initialize a vue project.

To create a new project, use the command (note: the project name cannot have capital letters and cannot use camel case):

vue create hello-vue

You will be prompted to select a preset template. You can choose the default preset that contains basic Babel + ESLint settings, or you can choose "Manual selection" to select the required configuration.

Select Manually select features.


Use history mode or hash mode for routing. Difference

between history mode and hash mode.

Configuration item selection reference.
After selecting the above configuration items according to your needs, wait for the download of dependencies
. After the project is created, use the following command to see the effect in the browser http://localhost:8080.

cd project-name // 进入项目根目录
run serve // 运行项目

---