vue再入门

1. 安装node.js

• 下载
  https://nodejs.org/zh-cn/
  官网下载，点击绿色按钮
  
  image.png

• 安装
  双击文件，按提示选择，路径选择D盘，文件名我设置成nodejs
  （此时的文件目录）

  
  
  image.png

2. 安装淘宝镜像 (npm>cnpm)

https://npm.taobao.org/

• 打开命令行（cmd) , 输入
  npm install -g cnpm --registry=https://registry.npm.taobao.org

  • 出错：
    
    image.png
    
    输入： npm --registry https://registry.npm.taobao.org info underscore
    
    image.png
    
    输入： npm install -g cnpm --registry=https://registry.npm.taobao.org
    
    image.png

• 测试：输入 cnpm -v （即安装成功）
  

  image.png

3.设置全局路径

• 找到node安装目录， 新建如图两个文件夹

  
  
  image.png

• 在命令行输入如下命令
  npm config set prefix “d:\nodejs\node_global
npm config set cache “d:\nodejs\node_cache
  此时 D:\nodejs\node_global 文件夹下多多了一个叫 etc 的文件夹

• 在当前目录（如下图）建立 node_modules 文件夹

  
  
  image.png

• 增加NODE_PATH(全局变量模块存放位置)

  • 右键 “此电脑” 》 选择“属性” 》 选择“高级系统设置”
    
    image.png

• 选择 “ 环境变量”

  
  
  image.png

• 新建“ NODE_PATH"

  
  
  image.png
  
  
  image.png

• 查看路径是否更改成功
  输入 cnpm prefix -g （即修改成功）
  

  image.png

4. 安装vue.js

• 输入 cnpm -v 再次确认下cnpm安装成功

• 输入 cnpm install cnpm -g 更新cnpm
  (此时使用 cnpm install *** 命令安装的文件都将保存到 D:\nodejs\node_global\node_modules 下
  

  image.png

• 输入 cnpm install vue安装vue

• 输入 cnpm install --global vue-cli 安装vue-cl（此时环境搭好了）

  • 错误：
    
    image.png
    
    按提示输入 cnpm install eslint -g
    (它提示缺什么，就按上面一样的语句装什么）

• 输入 vue init webpack "项目名称"

• 输入 cd "项目所在文件夹"

• 输入 cnpm install

• 输入 cnpm run dev

• 成功后我们进入浏览器，输入localhost:8080会展示下面的页面

补充：
删除已生成的node_modules文件夹，文件夹太多或者文件名太长
（在wins下删除会有问题）

• 右键文件夹， 选择 “ 添加到压缩文件” ， 选择 ”经典模式“ ，看到图下窗口

  
  
  image.png
• 勾选 " 压缩后删除源文件 ”
  这样删除速度会快很多

参考：
https://cn.vuejs.org/v2/guide/installation.html
http://cnodejs.org/topic/4f9904f9407edba21468f31e
http://blog.csdn.net/Small_Lee/article/details/68062223
https://www.cnblogs.com/WhiteCusp/p/4200220.html