vue2.0项目快速搭建工具——vue-cli

vue项目快速搭建工具——vue-cli

vue-cli是基于node环境的一个命令行工具。也就是说要执行命令

1.安装

npm install vue-cli -g 注：全局安装

2.vue引入vue-resource插件

npm方式：npm install vue-resourse --save-dev

main.js中写入
import Resource from "vue-resource"
Vue.use(Resource)

vue-resource插件具有以下特点：

2.1 体积小

vue-resource非常小巧，在压缩以后只有大约12KB，服务端启用gzip压缩后只有4.5KB大小，这远比jQuery的体积要小得多。

2.2 支持主流的浏览器

和Vue.js一样，vue-resource除了不支持IE 9以下的浏览器，其他主流的浏览器都支持。

2.3 支持Promise API和URI Templates

Promise是ES6的特性，Promise的中文含义为“先知”，Promise对象用于异步计算。
URI Templates表示URI模板，有些类似于ASP.NET MVC的路由模板。

2.4 支持拦截器

拦截器是全局的，拦截器可以在请求发送前和发送请求后做一些处理。
拦截器在一些场景下会非常有用，比如请求发送前在headers中设置access_token，或者在请求失败时，提供共通的处理方式

3.使用

3.1.创建项目文件夹 如：d:/mypro

3.2.进入文件夹，执行命令：vue init webpack [项目名称] 初始化一个vue+webpack项目

3.2.1 在文件夹中，执行npm install 更新项目的依赖模块【node_modules】

3.3. 搭建完成！

3.4. 命令行进入文件夹，执行令 > npm run dev 以开发模式启动项目服务器

就可以打开浏览器通过http://localhost:8080访问项目

4. 注意问题

不一定一次性安装成功！？！

安装完成后

命令行输入vue -V命令

回车【如果出现报错信息：不是内部或者外部命令也不是可运行的程序】说明安装失败了！

要重新安装

如果输入后回车出现版本信息，说明安装成功

项目不一定一次性创建成功？！