Detail steps are as follows:
First, install node.js
Note: After installing the windows version of node.js, good node and npm package management tools will automatically install, our follow-up of the installation will depend npm tool.
node.js official address: https://nodejs.org/en/download/ , as shown below:
Depending on the configuration of your computer, select you want to download the installation package, the authors chose windows 64bit.
The download is complete, in accordance with general windows applications, all the way to next can be installed successfully, it is recommended not to install the system disk (such as C :).
Second, the path settings in the global cache, and
Description: Sets the path can be installed by npm modules together, easy to manage.
1, in the installation directory nodejs, the new node_global and node_cache two folders, author of the installation directory is "D: \ Program Files \ nodejs \"
2, and set the global cache
npm config set prefix "D:\Program Files\nodejs\node_global"
with
npm config set cache "D:\Program Files\nodejs\node_cache"
After successful, with follow-up after npm install XXX -g command module installed in the D: \ Program Files \ nodejs \ node_global \ node_modules in
The installation may fail, use one of the following one way to solve :( I use the second)
1. Temporary Use
npm --registry https://registry.npm.taobao.org install express2. sustainable use
npm config set registry https://registry.npm.taobao.org- After the configuration can be verified by successful in the following manner
npm config get registry - or
npm info express
3. By using cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org- use
cnpm install express
Third, the installation cnpm
Note: Since many npm package are in a foreign country, we used here Taobao mirror server to be installed in our dependence module, so first install the "China's npm" - cnpm
Refer to the following URL: http://npm.taobao.org/
Installation command is:
npm install -g cnpm --registry=https://registry.npm.taobao.org
Fourth, set the environment variable (very important)
Description: Sets the environmental variables may be such that at any directory can be used to live cnpm, vue commands, without the need to enter the full path
1, the right mouse button, "this computer", select "Properties" menu, in the pop-up "system" in the left side of the dialog box select the "Advanced System Settings" pop-up "System Properties" dialog box.
2, click the Environment Variables dialog box pops up the following:
3, modify user variable PATH:
Select PATH, click Edit, behind the existing variable, adding the English ";" and then the "D: \ Program Files \ nodejs \ node_global" added to the end
4, the new system variables NODE_PATH:
In the following system variables click New, pop up box, the variable value is set to "D: \ Program Files \ nodejs \ node_global \ node_modules"
Fourth and fifth steps, first into the project file you want to install folder
Fourth, cnpm installation vue
cnpm install vue -g
V. Installation vue command-line tool
cnpm install vue-cli -g
Sixth, create project
1, you will come to the directory you want new construction, such as using the cd command "C: \ Users \ Administrator \ Desktop \ birdhelper>"
Create a new project based on webpack template project called birdhelper.
这时报错了 win10 vue-cli · Failed to download repo vuejs-templates/webpack: tunneling socket could not be established, cause=connect ECONNREFUSED 127.0.0.1:80
Solution:
The solution is instead created offline, we need to download the github repository vue-templates / webpack, and then extract it to a local. Download address: https: //github.com/vuejs-templates/webpack, after the download, unzip to .vue-templates directory of the local user directory.
After downloading the archive is webpack-develop.zip, after we unpack, change directory named webpack. Directory under the user directory .vue-templates, note the name of the folder in front of the dot (.).
This time, we then vue init webpack vuedemo command, need to bring offline initialization parameter representation --offline.
This time there
vue init webpack project-name (project name);
? Project the Description (A Vue.js Project) VUE-cli New Project (project description);
? Author (XXXX <[email protected]>); [email protected] ( project author);
? Vue Build
❯ + Compiler Runtime: Recommended for the Users MOST
Runtime-only: the About 6KB Lighter min + gzip, But Templates (or the any Vue-specific HTML) are allowed oNLY in .vue Files - the render Functions are required Elsewhere
Pick the Runtime + Compiler: Recommended for MOST Users;
the Install VUE-Router (the Y / n-) Y whether VUE-Router;??
the use ESLint to lint your code (the Y / n-) Y whether ESLint;??
of Pick AN? PRESET ESLint (the Use arrow Keys)
❯ Standard (https://github.com/feross/standard)
Airbnb (https://github.com/airbnb/javascript) none (configure it yourself) Pick Standard (https://github.com/feross/standard)
? Unit Tests with the Setup Mocha Karma +? (The Y / n-) n unit testing whether required;
the Setup whether E2E tests with Nightwatch (Y / n) n need unit testing;?
CD project-name (program catalog);
NPM the install mounted reliance;
NPM rUN running locally project dev
3, navigate to the project directory mytest
cd mytest
4, the installation of the project dependent modules that will be installed in: mytest \ directory under node_module, node_module folder is new, and download modules for the project based on the configuration of package.json
cnpm install
5. Run the project to test whether the project to work properly, this approach is to start with nodejs.
cnpm run dev
6, sometimes our server is not necessarily a node, perhaps the IIS, so we need to build the project out, integrate with IIS.
Construction of the project the following command
cnpm run build
The dist folder copy out into the release of IIS directory, enter the local ip and port IIS settings can be accessed in your browser. Good Luck, guys!
So far, we have set up in win10 successful vue, and can be integrated and iis server. Bang Bang is brought vue .net framework for developing web applications.
If you are new to download from GitHub a project, the project may be missing from the folder named node_modules, in order to let it run, you must
1. Go to the project file
2.npm install
3.npm run build
4.npm install npm-cli
5.npm run dev
The next time you run, simply enter the item, then you can npm run dev
1. Temporary Use
npm --registry https://registry.npm.taobao.org install express2. sustainable use
npm config set registry https://registry.npm.taobao.org- After the configuration can be verified by successful in the following manner
npm config get registry - or
npm info express
3. By using cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org- use
cnpm install express