Home > Web Front-end > JS Tutorial > vue.js installation tutorial graphic and text

vue.js installation tutorial graphic and text

小云云
Release: 2018-01-16 10:12:37
Original
2401 people have browsed it

This article mainly shares a vuejs installation tutorial worth collecting for everyone. It is easier to learn and master vue.js installation in the form of pictures and texts. This article has certain reference value. Interested friends can refer to it. Hope it helps everyone.

1. Install nodejs and bring its own npm environment.

Address: https://nodejs.org/en/download/, Node.js historical version download address: https://nodejs.org/dist/ You can choose the version that suits your operating system.

For the installation process, please refer to: Installation Configuration

2. Install the Taobao image.

Because the speed of domestic access to foreign links is too slow, it is recommended to set the npm registry source to a domestic mirror, which can greatly improve the installation speed.

Open cmd and enter directly: npm install -g cnpm –registry=https://registry.npm.taobao.org, press Enter, wait for installation...


npm install -g cnpm --registry=https://registry.npm.taobao.org
Copy after login

Note=There must be no spaces after, otherwise an error will be reported.

3. Install express (select to install).


cnpm install -g express
Copy after login

4. Install webpack.


cnpm install -g webpack
Copy after login

5. Install vue.


cnpm install vue
Copy after login

6. Install vue-cli.


cnpm install -g vue-cli
Copy after login

7. At this point, the environment setup has been completed and project initialization can begin.

Use the cd command in cmd to jump to the specified address, project initialization command: vueinitwebpackvue-projectname. projectname--The name of the project folder (the name cannot be in Chinese). This vue-projectname folder will be automatically generated in the working directory you jump to.


vue init webpack vue-projectname
Copy after login

Note: During the installation process, you need to enter the project name, description, author, etc., which is the one in the picture above? The answer behind.

8.cd to our project folder d:\Vue\vue-test and run the command cnpm install to install the package.


cnmp install
Copy after login

9. Test whether the project is installed successfully.


cnpm run dev
Copy after login

Have you all learned it? Hurry up and try it out.

Related recommendations:

What is the Vue.js framework?

Introduction to the new features of Vue.js 2.5

Detailed explanation of the syntax and common instructions of vue.js

The above is the detailed content of vue.js installation tutorial graphic and text. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template