Vue installation and use


Chinese website of Vue: includes installation, use, API and video.

1、 What is Vue

Vue is a front-end framework characterized by
Data binding:For example, if you change the value of the input tag of an input box, you willAutomatic synchronizationUpdate to the values of other components on the page that bind the input box


      Component-based:The small buttons on the page can be a single file. Vue. These widgets can be assembled directly like Lego building blocks by referring to each other


Download vue.js

Development or learning:<script src=“”>script>

Production environment:<script src=“[email protected]”>script>

2、 Vue installation steps

1. Install node.js.

Download address on official website:

Check whether the path environment variable is configured with node.js, enter “CMD” = > with “windows + R” shortcut key, enter the command: path, and output the following results (Ctrl + F is common in current page search):

         PATH=C:\Program Files\nodejs\;
Description installation successful
Check node.js version: node-v
NPM package manager is integrated in node.js
View NPM version command: NPM - V


(7) input commandnpm -g install npm, update NPM to the latest version

View version NPM – V

2. Install the public service – Taobao image (cnpm)

Use Taobao NPM image. The cnpm command replaces the default NPM command to increase the speed of packet loading and avoid resource constraints.

 npm install -g cnpm --registry=

3. Install webpack

    cnpm install webpack -g

4. Install Vue scaffold

    npm install vue-cli -g
(NPM cache clean -- force)

There will be some initialization settings, as follows:
    Target directory exists. Continue? (Y/n)Press enter directly to default (then the vue2.0 template will be downloaded, where you may need to connect the agent)
    Project name (vue-test)Direct return default
    Project description (A Vue.js project)Direct return default
    AuthorWrite your own name

5. Install Vue routing modulevue-routerAnd network request modulevue-resource

    cnpm install vue-router vue-resource --save

Startup project

    npm run dev





Recommended Today

[Redis5 source code learning] analysis of the randomkey part of redis command

baiyan Command syntax Command meaning: randomly return a key from the currently selected databaseCommand format: RANDOMKEY Command actual combat:> keys * 1) “kkk” 2) “key1”> randomkey “key1”> randomkey “kkk” Return value: random key; nil if database is empty Source code analysis Main process The processing function corresponding to the keys command is […]