win7 搭建安装nodejs 以及vue+webpack环境

一、nodeJS

1、登陆官网（http://nodejs.org/），首页的“INSTALL”按钮，直接点击就会自动下载安装，

2、安装"next" ,可以修改安装路径，我的选择安装路径:D:\nodejs,安装完会自动添加path的系统变量，变量值是你的安装路径，比如我的安装路径：D:\nodejs

3、cmd（win+r然后输入cmd进入）测试下是否安装成功。方法：在cmd下输入node -v，出现下图版本提示就是完成了NodeJS的安装。

4、配置npm的全局模块，在NodeJS的主目录下分别创建node_global、node_cache目录，

cmd下输入npm set prefix “D:\nodejs\global“和npm set cache “D:\nodejs\cache“； 
（斜体内容为你自己的文件路径）

5、配置全局环境变量

关闭cmd，打开系统对话框，“我的电脑”右键“属性”-“高级系统设置”-“高级”-“环境变量”。如下图

在系统变量下新建"NODE_PATH"，输入”D:\nodejs\global“。

6、cmd命令行里面，输入“npm install express -g”（“-g”这个参数意思是装到global目录下，上面设置的“D:\nodejs\global”里面），开启cmd命令行，进入node，输入“require('express')”来测试下node的模块全局路径是否配置正确了。正确的话cmd会列出express的相关信息。如下图

二、npm的安装。

新版的NodeJS已经集成了npm，安装nodeJS完成后npm也一并安装好了。cmd命令窗口行输入"npm -v"来测试是否成功安装。如下图出现版本，则OK

 

三、vue 环境搭建

在nodeJS，npm环境搭建的前提下，才可以搭建vue开发环境；

1、许多npm包都是在国外被墙不好安装，这用淘宝的镜像服务器，来对我们依赖的module进行安装。

2、cmd输入命令为：npm install -g cnpm --registry=https://registry.npm.taobao.org  回车等待

3、cnpm install -g vue-cli，回车，等待安装全局的vue-cli脚手架,搭建所需的模板框架

4、cmd输入vue 如图安装成功

5、新建一个项目文件夹（如：fonts），cmd  doc切换到当前文件夹，输入:vue init webpack project(项目文件夹名)，回车，可按下图操作:

安装完成，参考：https://blog.csdn.net/qq_33327325/article/details/82953687

6、切换到项目目录，执行测试，如图：

回车后，如图有测试路径：http://localhost:8081 成功