What environment does vue need to be installed?

vue needs to install the Node environment. The operation of vue depends on the npm management tool of node, and node can be used to package and deploy, parse vue single file components, parse each vue module, start the test server localhost, and manage plug-ins such as vue-router and vue-resource.

The operating environment of this tutorial: windows7 system, vue2.9.6 version, DELL G3 computer.

What environments need to be prepared and configured for Vue project development?

I believe that many people will encounter some big and small pitfalls when they first start to learn the vue framework and build a development environment. I built it once when I was learning angular, and after a When I built it for the second time a few months later, there was some confusion, so I wanted to sort it out today;

vue is now used in the front-end and is one of the more commonly used frameworks for front-end engineers. It has some similarities with angular place, so friends who have used angular should not find it too difficult to learn vue;

1: Download and install the node environment

Before building the vue development environment, Be sure to download node.js first

The operation of vue depends on the npm management tool of node.

And it is more convenient to use node. Package and deploy, parse vue single file components, parse each vue module, put them together, etc., start the test server localhost, and help you manage vue-router, vue-resource, etc. plugin. So usually we will use Vue node method, which is convenient and saves trouble.

node can be downloaded from the official website or the Chinese website. You can choose 32 or 64 according to your computer. URL: http://nodejs.cn;

2: After downloading node, open the docs management tool and check whether the node is successfully installed. Enter node -v and press Enter. The version number of node will be output,

The installation is successful. Since using npm in China is very slow, we recommend using Taobao npm image here. You can use

Taobao’s cnpm command management tool. Instead of the default npm management tool: $ npm install -g cnpm --registry=https://registry. npm.taobao.org;

# Three: After the Taobao image is successfully installed, we can use the vue-cli scaffolding globally and enter the command: cnpm install --global vue-cli Press Enter; verify whether the installation is successful, in the command Enter vue, vue information comes out, and the installation is successful;

Four: After building the scaffolding, we need to start building a new project. At this time, I suggest that you try not to install it on the C drive, because the files downloaded by vue are relatively large. If you want to change the drive, just enter D: and press Enter. You can change the disk directly,

## Then we start Create a new project and enter the command: vue init webpack my-project Press Enter, my-project is The name of my own folder is a project based on webpack. After entering it, press Enter until it appears whether to install vue-router,

## We will use this in the project, so just enter y and press Enter

The following will show whether js syntax detection is required. We don’t need it for the time being, so you can directly enter no. For the rest, you can directly enter no. They are all things we don’t need for the time being.

Four: The folder has been downloaded. Now you can enter the folder and enter: cd my-project and press Enter, because each template is interdependent. , so now we have to install the dependencies,

##Enter the command: cnpm install

##Five: After it has been installed, now we need to test whether the template we downloaded can run normally. Command line input:

npm run dev and press Enter.

8080 is the default port. If you want to access it, directly Enter localhost:8080 in the browser to open the default template;

In this way, our Vue basic project has been installed and running. Have stepped into the door of vue; scatter flowers and finish;

The above is the scaffolding construction method of vue-cli2.0. Now it has been upgraded to 4.0, and the project construction method is simpler and more convenient. Enter Command:

npm install -g @vue/cli, download the scaffolding tool. After the download is successful, enter the command: vue create Folder name,

Then select the configuration, the first default It is the default configuration, and the second one is manual configuration. Manual configuration depends on your project needs, configure the required files (but generally I choose the default configuration for convenience, haha), and then wait to create the folder;

After the file is successfully created, directly enter the command: npm run serve, and you can run the project!

Related recommendations: "

vue.js Tutorial

"

The above is the detailed content of What environment does vue need to be installed?. For more information, please follow other related articles on the PHP Chinese website!