vue-cli 3.0安装与使用

---

默认你已经安装了node.js

1.安装

npm install -g @vue/cli

2.创建vue-app项目

vue create vue-app

3.创建项目会遇到的选项

Babel：将ES6编译成ES5
TypeScript：JS超集，主要是类型检查
Progressive Web App (PWA) Support：PWA
Router：路由管理
Vuex：状态管理
Linter/ Formatter：代码检查工具
CSS Pre-processors：css预编译
Unit Testing：单元测试，开发过程中前端对代码进行自运行测试

选择相应项目后，会询问详细配置

• 是否使用Class风格装饰器？

Use class-style component syntax? (Y/n) y

未使用：home = new Vue()
使用：class home extends Vue{}

• 使用Babel与TypeScript一起用于自动检测的填充? y

Use Babel alongside TypeScript for auto-detected polyfills? (Y/n) y

• 路由使用历史模式?

Use history mode for router? (Y/n) y

• 使用什么css预编译器？

Pick a CSS pre-processor: (Use arrow keys)
Sass/SCSS (with dart-sass)
Sass/SCSS (with node-sass)
Less
Stylus

• 选择linter / formatter配置

Pick a linter / formatter config: (Use arrow keys)
TSLint
ESLint with error prevention only
ESLint + Airbnb config
ESLint + Standard config
ESLint + Prettier

tslint：typescript格式验证工具
eslint w...：只进行报错提醒；//选这个
eslint + A...：不严谨模式；
eslint + S...：正常模式；
eslint + P...：严格模式；

• 代码检查方式

Pick additional lint features:
Lint on save
Lint and fix on commit

Lint on save：保存时检查
Lint and fix on commit：修改提交时检查

• 单元测试方案

Pick a unit testing solution:
Mocha + Chai
Jest

• E2E解决方案

Pick a E2E testing solution: 
Cypress (Chrome only)
Nightwatch (Selenium-based)

• 将配置放在哪里

Where do you prefer placing config for Babel, PostCSS, ESLint, etc.? 
In dedicated config files
In package.json

In dedicated config files：专用文件
In package.json：package.json里面 //一般来说选这个

• 是否保存当前设置好的配置

Save this as a preset for future projects? (y/N)

保存：

Save preset as:

命名配置名称，以后可以直接使用这一次的配置