Grammar is learned, now it's time to practice.
Try installing a scaffold.
1. Installation environment
(1), install node
First download from the official node.js , the installation process is very simple, so I won't go into details here (fool installation)
After the installation is complete, use the command line to enter: node -v, the version number is displayed, indicating that the installation is successful
After installing node, it will bring its own npm installation package management tool. The npm server is foreign, so it will be very slow, which may affect subsequent operations, so install Taobao mirroring here:
enter:
npm install -g cnpm --registry=https://registry.npm.taobao.org
After installation, enter: cnpm -v, if the version number is displayed, the installation is successful
(2), install webpack
enter:
npm install webpack -g
The -g here means global installation, if you don't want to install it globally, you can don't
After installation, check the version number to confirm whether the installation was successful: webpack -v
(3), install the vue-cli scaffolding:
enter:
npm install vue-cli -g
After installation, enter: vue -V (V is uppercase!)
2. Build the project
Through the above steps, we have set up the environment, and now we start to build our project
1. Open the command line in the directory where you want to build the project. If git is installed, you can use git bash here
2. Input: vue init webpack vueclipractice
The vueclipractice here is the project name, you can start it yourself, but you can't use Chinese.
Ok, the project is created, see if the newly created project exists
3. Enter the project and install dependencies
npm install
4. Install vue routing module and network request module
cnpm install vue-router vue-resource --save
Ok, now it's done, let's see what the directory looks like
5. I use the compiler to open it and explain what each file in each directory is for.
6. Start the project
enter:
npm run dev
After success, the following image will be displayed
Enter localhost:8080 in the browser
Note: Do not use port 8080
Ok, so far vue-cli is built.