Vue环境搭建

1、安装node.js

Vue的运行依赖于nodejs的NPM管理工具，所以首先安装node.js

官网：https://nodejs.org/en/download/

源码：http://nodejs.cn/download/

安装路径：D:\Program Files\nodejs

检查PATH的环境变量是否配置了nodejs :D:\Program Files\nodejs

检查node安装情况：打开cmd输入node -v

2、设置npm安装和缓存路径

 

在nodejs安装目录下创建node_global和node_cache文件夹，分别用来存放NPM模块的安装路径和NPM缓存路径。

在cmd输入

// 设置npm安装程序时的默认位置

npm config set prefix "D:\Program Files\nodejs\node_global"

// 设置npm安装程序时的缓存位置

npm config set cache "D:\Program Files\nodejs\node_cache"

3、基于node.js，利用淘宝npm镜像安装相关依赖

在cmd输入

npm install -g cnpm --registry=https://registry.npm.taobao.org

回车等待安装

安装完毕nodejs文件夹下的node_global和node_cache有了基本依赖库

4、安装全局vue-cli脚手架，用于帮助搭建所需的模板框架

在cmd输入

npm install vue-cli -g

5、安装webpack，用于打包生产代码

在cmd输入

npm install webpack -g

6、给项目安装npm依赖

在cmd进入项目目录

然后输入cnpm install安装npm依赖，如图项目在C:\vue\vue_test\下

7、启动本地测试服务

输入 npm rum dev 启动服务，访问地址http://localhost:8080

8、打包生产文件

注：webstorm使用快捷键ALT+12打开windows命令行