vue.js 开发环境配置 完整版

教大家快速安装vue.js的运行环境。

一. 安装node环境

第一步当然是先去node官网去下载安装包。https://nodejs.org/en/download/    然后选择自己的系统版本（我是win64)    图片如下：

按照windows一般应用程序，一路next就可以安装成功。

安装完成之后，大家一贯的风格就是想到去文件夹里面去找**.exe文件双击打开，大家请注意这里我们不要去双击打开如图下的node.exe这个我们暂时就不用管他了。

我们此时打开命令终端窗口输入cmd单击确定如图下：

现在我们就进行node环境测试，

我们再次进入nodejs官网https://nodejs.org/en/about/

复制红框中的代码并打开终端命令窗口直接输入node然后粘贴代码然后回车如图下：

会出现一下代码段 然后用浏览器访问  标红的地址

、

恭喜你说明你的node已经安装成功了，  测试也是没问题的。

我们node 安装成功了，通常我们也可以查看版本 来知道知否安装成功 命令：node -v     如下图：2

二. npm安装

     安装完node之后，就要安装npm，由于许多npm包都是在国外，安装起来特别慢，所以我们这里     利用淘宝的镜像服务器，来对我们依赖的module进行安装。安装命令为：npm install -g cnpm --registry=https://registry.npm.taobao.org  之后回车等待命令。

三. webpack 安装

     我们安装webpack 我们这里当下用于构建初始一个新项目，命令为：npm install -g webpack。

四. vue-cli 脚手架安装

      接着安装全局的vue-cli脚手架,用于帮助搭建所需的模板框架，命令为：npm install -g vue-cli。安装完后，可以输入vue，然后回车，如果出现vue的信息，则说明安装成功了。

五. 创建新项目

      自己找一个合适的地方，新建一个项目文件夹，根据自己的需要命名，我的命名为 demo，然后，进入这个文件夹。也可以下载Git 打开此文件夹， 右键git bash here，进入到此文件夹。我这里依然是dos窗口如图：

输入:vue init webpack my-vue(项目文件夹名)，回车，等待一小会儿，项目正在从git上下载，可按下图操作:

项目构建：

1.项目名称。      2. 项目描述。    3.作者 。          4.build 选择（键盘上下方向选择）第二项。      5.vue-router 因为我们项目组件之间需要router连接、通信等，所以我们这里建议启用。  6.ESlint 作用是简析es6语法书写规范等 ，我们这里也建议启用。  下面这这俩项的意思是要不要测试，我们这里不需要。最后我们根据最后三个命令来进入项目（cd my-vue）、安装项目依赖（npm install 这里也可以用cnpm）、运行项目（npm run dev）。

这样我们就新建完成了一个新的项目。

附言：

其实中间有很多步奏都可以省略掉，如果想三分钟安装新建一个新项目就可以省略掉node测试步奏,