Vue Environment Setup and project initialization (Windows)

1. Install node. js

Official website Download Install: https://nodejs.org/en/

Version view: node-v

Note: The node version is best to be a little new and recommended for more than 6.0.

2. NPM install Webpacka) command

NPM install-g webpack//Global installation

NPM install-g webpack-dev-server//Installation Debugging Tools

b) Webpack Installation permissions Issues

Open a command prompt (or node. js command Prompt) with administrator privileges if the error that appears indicates that user rights are limited

Open the node. js Command Prompt window as user users:

The administrator opens the node. js Command Prompt window as follows:

3. NPM installation VUE-CLIc) command

NPM install-g VUE-CLI//Global installation

4. Create a new project based on the Webpack template

Note: Vue.js official based on the provided development template introduction See "Vue Development Template Introduction "

Create a project directory D:\\vue_project

Execute the following command under the project directory

Vue init webpack project-name//default installation version 2.0

Vue init webpack#1.0 project-name//Install version 1.0

5. Project directory

6. Installation Project Dependencies

Be sure to install from the official warehouse, NPM server is abroad so this step will be slow to install.

NPM Install

Do not install from the domestic mirror CNPM (which will cause a lot of dependent libraries missing later)

CNPM Install

7. Start the project

NPM Run Dev

8. Release

NPM Run Build

A) Vue-simple-webpack

After the Publish command is executed, the build.js is generated at the time of publication and is compressed.

b) Vue-webpack

After the Publish command is executed, all static resources, including index.html, are generated into the dist directory. That means you can simply take the dist directory to publish your app, such as publishing the Dist directory as a Web site under IIS.

Vue Environment Setup and project initialization (Windows)