大话谈VUE之环境搭建

一.安装node.js :https://nodejs.org/en/

我安装了大多数用户使用的。安装时，除了安装目录设置一下，其他默认

打开cmd，依次输入：node -v和npm -v，若能显示版本号，则说明安装成功

二.配置环境变量

1.在nodejs的安装目录根目录下新建两个文件夹：node_global和node_cache

2.在路径nodejs\node_modules\npm\下打开配置文件npmrc，把里面的内容改为：

prefix=D:\tool\nodejs\node_global

cache=D:\tool\nodejs\node_cache

（以我的路径为例）

prefix是全局下载的路径，cache是缓存位置了，这样下载下来的文件就不会默认到c盘下了

3.环境变量path中新增：D:\tool\nodejs\node_global（以我的路径为例）

三.安装淘宝镜像cnpm

打开cmd运行：npm install -g cnpm --registry=https://registry.npm.taobao.org

(清除淘宝镜像cnpm命令：npm uninstall cnpm -g)

四.安装webpack

cnpm install webpack -g

注：有些时候执行这个命令会报“cnpm不是批处理”这样的错误，遇到这样的问题，可以关闭cmd，重新打开，执行此命令。

五.安装vue脚手架

cnpm install vue-cli -g

验证：vue -V（V是大写，有版本号为成功）

 

六.新建vue项目

新建vue项目的文件夹，我的是：D:\tool\vue

打开cmd调到该路径下，运行命令：

vue init webpack my_vue （my_vue是项目名称）

接着会让你填些项目信息

project name 项目名称

第二个 回车

Author 作者

第四个 回车

yes，no，no，no

最后一个回车，推荐用npm 服务器安装项目依赖，不要从国内镜像cnpm安装(会导致后面缺了很多依赖库)

下载完依赖后就可以启动项目了

七.启动项目

路径调到my_vue项目下（以我的为例），运行：npm run dev

查看localhost 8080 能否查看

原文地址：http://note.youdao.com/noteshare?id=8b0a3fc7d09027ffd6fd82e261309171