搭建一个vue-cli3+ts+element-ui的project

第一步：vue create mutiple-video-demo    Enter进入下一步

第二步：select Manually select features    Enter进入下一步

第三步：select Babel Typescript Router Vuex Css Pre-processors Linter/Formatter    Enter进入下一步

关于为什么这样选择：

Babel：将ES6编译成ES5

TypeScript：JS超集，主要是类型检查

Router和Vuex，路由和状态管理

Linter/ Formatter：代码检查工具

CSS Pre-processors：css预编译

第四步：手动配置

1、TypeScript

是否使用class风格的组件语法，是

Use class-style component syntax?

2、是否使用babel做转义，是

Use Babel alongside TypeScript for auto-detected polyfills?

3、Router

路由使用历史模式，一般实际项目要使用history

Use history mode for router? (Requires proper server setup for index fallback in production)

4、CSS Pre-processors css预处理，我用的sass

Pick a CSS pre-processor (PostCSS， Autoprefixer and CSS Modules are supported by default) 

  Sass/SCSS (with dart-sass)

  Sass/SCSS (with node-sass)

  Less

  Stylus

5、Linter / Formatter 代码风格、格式校验，我用的tslint

  TSLint

  仅错误预防

  ESLint with error prevention only

  Airbnb配置

  ESLint + Airbnb config

  标准配置

  ESLint + Standard config

  Prettier配置（常用）

  ESLint + Prettier

6、选择lint方式：Pick additional lint features，选择保存时检查

保存时检查

Lint on save

提交时检查

Lint and fix on commit

7、Unit Testing 单元测试，不使用

Mocha + Chai

Jest

8、选择 Babel，PostCSS， ESLint 等自定义配置的存放位置，在package.json里配置

In package.json

9、将此作为将来项目的预置吗？Yes，下次可以直接用 

10、项目配置名称，设置配置名称为：admin

第五步：启动项目$ cd mutiple-video-demo    $ npm run serve

第六步：安装element-ui

npm install element-ui -s

解决项目中eslint warning问题npm run lint --fix