使用之前，我们先来明白这几个东西是用来干什么的。
- node.js: 一种javascript的运行环境，能够使得javascript脱离浏览器运行。 Node.js的出现，使得前后端使用同一种语言，统一模型的梦想得以实现。
- npm: Nodejs下的包管理器。
- webpack: 它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做相应的准备，比如资源的合并和打包。
- vue-cli: 用户生成Vue工程模板。（帮你快速开始一个vue的项目，也就是给你一套vue的结构，包含基础的依赖库，只需要 npm install就可以安装）
第一步，安装nodejs
nodejs中文网:http://nodejs.cn/
下载后安装，路径推荐更改在盘根目录。
( 这里因为我的另一个磁盘分区装了其他OS，只剩C盘了，如果你有其他盘推荐放到其他盘里 )
默认会自动添加到path环境变量
最后完成安装。
安装完成 查看变量和版本
使用Cmd命令（Windows键 R）
- 查看环境变量 :
echo %PATH% - 查看Node版本:
node -v - 查看npm版本:
npm -v
第二步，更改默认模块和缓存目录
刚安装后，nmp本地仓库文件夹生成在用户目录，并不是说NodeJS和NPM安装好了到这里就能直接使用了，这也是新手经常犯的一个错误之一。因为默认情况下，NPM安装的模块并不会安装到NodeJS的程序目录。而是安装到系统用户组路径下的文件夹，如果不修改npm的模块安装目录，那么它默认情况下都会安装到这里，随着你测试开发各种不同的项目，安装的模块越来越多，那么这个文件夹的体积会越来越大，直到占满你的C盘。这就是为什么要修改npm的配置的原因。。
因为博主电脑就一个盘了，只能安装到C盘，给大家演示下安装C盘自定义路径。（其他盘方法同）
我打算把这两个路径换到安装nodejs的目录，C:nodejs
在C:nodejs新建两个文件夹
- node_global
- node_cache
- § 这两个文件夹是全局模块目录和缓存目录
然后运行以下2条命令（后边的是路径，根据自己实际情况修改）
npm config set prefix "C:nodejsnode_global"npm config set cache "C:nodejsnode_cache"
查看npm的本地仓库路径:
命令: npm list -global
更改前:
更改后:
第三步、接下来配置镜像站
配置淘宝镜像站:
命令: npm config set registry=http://registry.npm.taobao.org
检查镜像站是否配置成功: npm config get registry
- 国内镜像站，速度更快，加速安装。
第四步、查看配置文件 （安装可忽略）
输入命令 npm config list 显示所有配置信息，会生成一个配置文件
生成的配置文件路径 C:UsersAdministrator.npmrc
使用文本编辑器编辑它，可以看到刚才的配置信息（只是让你看到修改，so安装可忽略这一步）
第五步、安装npm
安装npm : npm install npm -g
默认的模块C:nodejsnode_modules 目录
将会改变为C:nodejsnode_globalnode_modules 目录，
如果直接运行npm install等命令会报错的。
我们需要修改系统变量
增加环境变量NODE_PATH 内容是：C:nodejsnode_globalnode_modules
（然后，需要重新打开CMD让上面的环境变量生效）
第六步、npm安装vue.js
命令：npm install vue -g
- 这里的 -g 是指安装到global全局目录去
安装 vue-router
命令： npm install vue-router -g
- vue-router 是专为 Vue.js 开发的便于实现单页应用的工具库，能够以声明式的方法编写页面的导航和跳转信息。
安装 vue脚手架
命令： npm install vue-cli -g
⊗ 因为vue脚本在自定义的global目录下，不在path环境变量。我们需要去系统变量里添加。
- 对path环境变量添加
C:nodejsnode_global - ⊕注意: win10以下版本的，横向显示PATH的，注意添加到最后时，不要有分号【;】
(修改path后需要重新打开cmd 才会上边更改的变量生效)
测试vue是否可用
命令：vue -V
- 出现版本号即配置正确 注意
-VV是大写的
第七步、vue配置完成后，配置第一个项目
vue-cli工具是内置了模板包括 webpack 和 webpack-simple
这里我选择创建内置webpack项目到 C盘的nodejs文件夹下 （可根据自己路径选择）
创建一个webpack项目
即首先cd到要安装的路径（可根据自己路径选择）
命令: cd C:nodejs
创建webpack项目: vue init webpack vue01
初始化，安装依赖
- 进入项目:
cd C:nodejsvue01 - 安装依赖:
npm install - 运行项目:
npm run dev
成功界面，提示打开地址http://localhost:8080
打包生成项目（编译成已构建文件）
命令: npm run build
最终结果生成在 dist 文件夹
NMP下新建出来的vue01的目录描述：
相关链接:
- 博客园: npm安装教程
- 简书: npm安装vue.js
- 百度经验: NodeJS、NPM安装配置步骤(windows版本)
- api文档: Node.js中文网
我的博客即将同步至腾讯云 社区，邀请大家一同入驻：https://cloud.tencent.com/developer/support-plan?invite_code=7x3d1ef6mcj3
