Introduction

There are many ways to create a vue project. Here we only introduce the use of webpack scaffolding to create a vue project. The following will create a movie as an example project.

Pre-environment preparation

Step 1: Install npm and node
. Download the corresponding npm version and node version of the machine from the official website. I will not introduce it here. After the installation is complete, check whether the installation is successful.
Inspection method: open the control command line program-"cmd, enter node -v and npm -v to check their version numbers, if there is, the installation is successful. As shown in the figure below,
The above picture shows that the installation is successful
if the npm that comes with node is not the latest version, you can use the command
npm install -g npm
so that npm is the latest version (-g stands for global installation)

Start creating project

Step 2: Initialize the movie project
1. Step 1: Install vue-cli
npm install vue-cli -g //Install vue-cli globally

The installation result is as shown in the figure below.
Insert picture description here
Check whether the vue-cli installation is successful, you cannot check vue-cli, you can only check vue

Insert picture description here
Step 3: Create the project

Select the path and create a new vue project. Here I have taken the movie project as an example. First use cd "path" to enter the corresponding directory. In this example,
Insert picture description here
use the command to create a new project and set the project name and other information.
vue init webpack "movie"

Step 4: Run the project

Now that the movie project has been created, use the command to enter the project root directory
cd movie to
Insert picture description here
enter the project directory, install dependencies before running, use the command, this step is operated in the movie directory! ! !

npm install

npm run dev

Insert picture description here

So far, the movie project of vue has been created. Below, please see the initial interface of the movie project.

Use vue-cli to initialize and build the vue project. We will get a file structure, as shown in the figure below:

where src is what we wrote and contains about the following files!
Insert picture description here
Now you can code codes happily! If it is useful to you, please comment 1, thank you for browsing