vue-cli脚手架的搭建

以下是我总结的vue-cli脚手架搭建的过程

2.jpg

（1）检查node版本
在安装vue的环境之前，安装NodeJS环境是必须的。可以使用node -v指令检查，需要保证安装了4.0版本以上的nodeJS环境。
安装后命令运行：node -v

检查node.png
(2).安装 cnpm :
npm install -g cnpm --registry=https://registry.npm.taobao.org
安装后：cnpm -v 查看是否安装成功
（3）全局安装Vue脚手架 ： cnpm install -g vue-cli
安装后用vue -V查看是否安装成功 (注:这里的V是大写)
（4）初始化一个项目： webpack: vue init webpack my-test
注意这里的my-test是项目的名称可以说是随便的起名，但是需要主要的是“不能用中文

? Project name (my-test) ---------------------项目名称
? Project name exprice
? Project description (A Vue.js project) ---------------------项目描述
? Project description A Vue.js project
? Author Datura --------------------- 项目创建者
? Author Datura
? Vue build (Use arrow keys)
? Vue build standalone
? Install vue-router? (Y/n) --------------------- 是否安装Vue路由，也就是以后是spa（但页面应用需要的模块）
? Install vue-router? Yes
? Use ESLint to lint your code? (Y/n) n ---------------------是否启用eslint检测规则，这里个人建议选no
? Use ESLint to lint your code? No
? Setup unit tests with Karma + Mocha? (Y/n)
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? (Y/n)
? Setup e2e tests with Nightwatch? Yes
vue-cli · Generated "exprice".
To get started: --------------------- 这里说明如何启动这个服务
cd exprice
npm install
npm run dev
(5).进入 my-test : cd my-test
(6).安装项目依赖： cnpm install
(7).运行项目： cnpm run dev

vue弹出.png

下面我简单的说明下各个目录都是干嘛的：

目录.jpg

以上就是全部vue-cli脚手架搭建的全过程