Vue环境搭建及node安装过程整理
一、nodejs的安装
Node.js安装包及源码下载地址为：https://nodejs.org/en/download/。
我们可以根据不同平台系统选择你需要的Node.js安装包。Node.js 历史版本下载地址：https://nodejs.org/dist/
这里演示的是Window64位安装Node.js，下面演示的是采用安装包的方式来安装。
1、Windows 安装包(.msi)
Node.js默认安装目录为 "C:\Program Files\nodejs\" , 你可以修改目录，并点击 next（下一步）：
:点击 Install（安装） 开始安装Node.js。你也可以点击 Back（返回）来修改先前的配置。 然后并点击 next（下一步）：
安装完之后启动cmd依次执行以下两条命令检测是否安装成功，结果如下：
二、node.js的环境变量的新建。 //我安装的路径是 D:\soft\nodejs
其实安装完node，就自动在path里增加环境变量，但是为了以后的本地部署项目，我们需要找到node.js的安装根目录，在当中新建“node_global”和"node_cache"两个文件夹。
1、 启动cmd依次执行以下两条命令
npm config set prefix " D:\soft\nodejs\node_global"
npm config set cache " D:\soft\nodejs\node_cache"
2、 设置环境变量
说明：设置环境变量可以使得住任意目录下都可以使用cnpm、vue等命令，而不需要输入全路径
1．鼠标右键"此电脑"，选择“属性”菜单，在弹出的“系统”对话框中左侧选择“高级系统设置”，弹出“系统属性”对话框。
2．点击环境变量弹出下列对话框：
3．新增系统变量NODE_PATH：把变量值设置成“D:\soft\nodejs\node_global\node_modules” （这样就可以把后面全局安装的装到global里并且可以直接用命令使用。）
4． 修改用户变量PATH：选中PATH，点击编辑，把“D:\soft\nodejs\node_global;”加到前面
三、安装淘宝的npm镜像
输入npm install -g cnpm –registry=https://registry.npm.taobao.org，即可安装npm镜像，以后再用到npm的地方直接用cnpm来代替就好了。
这个其实看个人爱好吧，因为npm在国内下载速度是很慢，所以就用npm下载安装cnpm可以更快的下载后面的依赖等等。
四、安装全局vue-cli脚手架、webpack
命令输入
cnpm install vue –g //全局安装vue
cnpm install -g vue-cli //全局安装vue-cli
cnpm install -g webpack //全局安装webpack
cnpm install -g webpack-dev-server //安装webpack的本地webserver
安装完成后，vue-cli脚手架其实就已经把vue也装掉了，所以只需输入vue -V 和 webpack -v 等等就可以查看安装成功与否。
下面是以上命令的结果:
$ npm install vue -g E:\nodejs\node_global `-- vue@2.4.4 $ npm install -g vue-cli E:\nodejs\node_global\vue-init -> E:\nodejs\node_global\node_modules\vue-cli\bin\vue-init E:\nodejs\node_global\vue-list -> E:\nodejs\node_global\node_modules\vue-cli\bin\vue-list E:\nodejs\node_global\vue -> E:\nodejs\node_global\node_modules\vue-cli\bin\vue E:\nodejs\node_global `-- vue-cli@2.9.1 +-- async@2.5.0 | `-- lodash@4.17.4 +-- chalk@2.1.0
..... 此处省略很多结果数据 .....
$ npm install webpack -g E:\nodejs\node_global\webpack -> E:\nodejs\node_global\node_modules\webpack\bin\webpack.js > uglifyjs-webpack-plugin@0.4.6 postinstall E:\nodejs\node_global\node_modules\webpack\node_modules\uglifyjs-webpack-plugin > node lib/post_install.js E:\nodejs\node_global `-- webpack@3.7.1 +-- acorn@5.1.2 +-- acorn-dynamic-import@2.0.2 .....此处省略多行数据....... npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\webpack\node_modules\chokidar\node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) $ npm install -g webpack-dev-server E:\nodejs\node_global\webpack-dev-server -> E:\nodejs\node_global\node_modules\webpack-dev-server\bin\webpack-dev-server.js E:\nodejs\node_global +-- UNMET PEER DEPENDENCY webpack@^2.2.0 || ^3.0.0 `-- webpack-dev-server@2.9.1 +-- ansi-html@0.0.7 +-- array-includes@3.0.3 .....此处省略多行数据...... npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\webpack-dev-server\node_modules\chokidar\node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) npm WARN webpack-dev-server@2.9.1 requires a peer of webpack@^2.2.0 || ^3.0.0 but none was installed. npm WARN webpack-dev-middleware@1.12.0 requires a peer of webpack@^1.0.0 || ^2.0.0 || ^3.0.0 but none was installed.
