vue2.0.js开发环境搭建

大家好，今天下午对于vue项目环境的搭建进行了研究，一直以来，我都是用cdn的方式将vue.js引入Html界面，然后就开始刷vue的官方文档了。在刷过文档之后，我就想着，真实的项目是怎么样子的呢，然后就开始了vue-cli脚手架的搭建和使用，下面是我搭建环境的步骤以及我自己初步使用vue-router实现的一个简单的不能再简单的例子。注意，文中的例子适合对vue已经有一定的了解，对vue组件化概念并且对es6有了解的朋友们。

1.安装node.js(http://www.runoob.com/nodejs/nodejs-install-setup.html)

2.基于node.js,利用淘宝npm镜像安装相关依赖

在cmd里直接输入： 

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

回车，等待安装... 

3.安装全局vue-cli脚手架,用于帮助搭建所需的模板框架 

在cmd里 

     1) ：按照vue-cli

输入：cnpm install -g vue-cli，回车，等待安装... 

     2). 确定是否安装成功

输入：vue，回车，若出现vue信息说明表示成功

4.创建项目

在cmd里输入： 

vue init webpack vue_test(项目文件夹名) 

回车，等待一小会儿，依次出现‘git’下的项，可按下图操作

5.安装依赖

在cmd里 

     1).输入： 切换到项目目录

cd vue_test（项目名），回车，进入到具体项目文件夹

     2).输入： 安装依赖

cnpm install，回车，等待一小会儿

回到项目文件夹，会发现项目结构里，多了一个node_modules文件夹（该文件里的内容就是之前安装的依赖）

基于脚手架创建的

6.测试环境是否搭建成功

（1）：在cmd里输入： 运行环境

cnpm run dev

（2）：在浏览里输入： 

localhost:8080(默认端口为8080)