下辈子再也不学前端系列——一、利用vue-cli创建一个vue项目

准备工作

一、安装node.js
二、设置npm的registry（默认的下载地址是国外的太慢，用这个命令注册成国内镜像服务器）
npm config set registry https://registry.npm.taobao.org
npm info underscore （如果上面配置正确这个命令会有字符串response）
三、 安装webpack
npm install webpack -g
四、全局安装vue-cli (vue项目脚手架)
npm install -g vue-cli

全部下载完成之后开始创建vue项目

vue cli3之前的版本：

vue init webpack my-project (项目名)
运行会问你很多问题，第1个选 Y ,其它的都选 N ，最后一个选 NPM。运行完
cd my-project （进入项目文件夹）
npm install
npm run dev (运行项目，默认端口号是8080，在浏览器上访问http://localhost:8080,出现vue默认页面，即安装成功。ctrl+C 关闭服务)

安装项目运行环境

npm install --save axios (用于向后端服务器发送ajax请求)
npm install element-ui -S （前端UI，可根据需要选择其它UI）
npm install vue-router -S （路由，用于页面跳转）
npm install vuex --save （专为 Vue.js 应用程序开发的状态管理模式）

vue cli3之后的版本，也是今天的重点

1、 创建一个文件夹 在文件夹地址输入cmd，输入 vue create + 项目名称，

出现配置选项，配置你的项目
2、选择 Manually select features，手动配置项目，上下键翻页，空格选择选项，回车下一步
详解一下上面的选项列表：
1.Choose Vue version:选择版本号
2.Babel:es6转es5
3.TypeScript：支持typeScript
4.Progressive Web App Support ：详情百度Progressive Web Apps，一般不选
5.Router：自动配置路由
6.Vuex：配置全局状态管理
7.CSS Pre-procsssors：css预加载器
8. Linter / Formatter：代码规范
9. Unit Testing：单元测试
10.E2E Testing：E2E测试
个人一般选择 125678

3.选择vue版本

4.选择路由模式
历史路由：地址美观，但兼容性差，会出现一些小问题，需要后端配合
哈希路由：简单好用，会在地址上加#
5.根据你前面的选择会出现一些个性选择，这里暂时省略掉了，直接开始下一步，把你的配置项放在哪里看个人习惯，本人喜欢放在 package.json里
6.点击回车之后就是 你希望保存你的配置，以后快捷使用吗，一般选择是

…经过一系列的加载…
就创建好了，然后把项目拖到你的编辑器里，npm run serve启动
打开浏览器 http://localhost:8080/
如果出现 大功告成可以开始开发了

写在后面：最近记性越来越差了，很多基础都忘了，毅然决然从头再走前端之路，所以开了下辈子再也不学前端系列，日后就在这个新建的项目上更新