Vue.js在Windows系统的开发环境配置

今天在配制vue.js的开发环境，顺便做了个笔记，一方面方便公司新的同事可以快速搭起环境，另一方面也希望对类似我这种刚接触vue.js的小白白有点帮助，对你有用的话就给我点几个赞吧！

第一步，Node.js安装

​ 在windows下安装node.js不像linux、Max OS下那样通过命令就可以了，要自己到Node.js的官网上去下载对应版手动安装。安装完成后可以通过下面两个命令来查看是否安装成功。安装成功后把node.js的安装目录添加到系统path环境变量中。

node -v
npm -v

node-v.png

​ 有些时候安了Node.js，但是不是最新的版本了，想更新到最新版本怎么办呢？最简单的方式就是去管网下载最新的重新安装一次。当然另外也可以通过命令来升级版本。

npm install npm -g //更新npm 

​ 在windows下好像不能使用n模块来管理node.js的版本，所以我们要下载个gnvm。下载后把它复制到node.js的安装目录下，在命令行中执行下面命令来验证是否可用。

gnvm version

​ gnvm安装成功后就可以通过gnvm来更新node.js的版本了。

gnvm update latest

通过gnvm ls可以查看本机上已有的node.js版本，使用gnvm use 版本号可切换使用的node.js版本

gnvm ls
gnvm use 8.1.2

第二步，安装webpack、Vue、Vue-cli

执行下面命令进行安装。

npm install webpack  –g
npm install vue -g
npm install vue-cli -g

第三步，初始化一个vue项目

在CMD中定位到创建项目的目录，执行以下命令创建初始化一个项目。

cd d:\test
vue init webpack vuetest

进入到vuetest目录，通过npm install来下载项目依赖

cd d:\test\vuetest
npm install

下载axios

npm install axios 

第四步，运行和编译

npm run dev //项目运行
npm run build //项目打包

对于通过 npm run dev支行起来的项目怎么停止呢？小白可能不知道，可在命令行中通过ctrl+c来终止已运行的项目。