使用Vue-cli构建vue项目

CQY
92 阅读1分钟

首先创建一个项目

vue create '项目名称'
  • 系统将提示你选择一个预设功能。可以选择基本Babel+ES设置的默认值，或者选择 "Manually select features" 自己手动配置来选择您的功能。

e26d16e2aacb17e5a0e330122c85b11.png

  • 设置快速创建新项目需要的原型，而手动设置提供更多适合生产的项目可能的默认选项。

  • 选择 "Manually select features" 自行配置

image.png

  1. 选择版本 vue2.0 or vue3.0

image.png

  1. babel：es6转es5的语法

  2. TypeScript: 是否使用Ts进行编程

  3. Progressive Web App(PWA) Support：是否引入渐进式Web应用程序（PWA）支持

  4. Router：是否引入Vue-Router (路由模式：Y: history or N: hash)

image.png

  1. Vuex：是否引入VueX状态管理

  2. CSS Pre-processors: 样式预处理器选择

image.png

dart 编写的sass 
node 编写的sass
less
Stylus

8. Linter/Formatter：是否引入格式验证（选择之后有以下选项）

image.png

ESLint with error prevention only 只有报错功能
ESLint + Airbnb config 简化模式
ESLint + Standard config 标准模式
ESLint + Prettier 严格模式

image.png

 lint on save 保存即检验
 lint and fix on commit 提交时进行检验及修改

image.png

保存配置位置 <br/>
In dedicated config files 额外文件中\
package.json package.json中

image.png

是否将当前配置保存为默认设置

9. Unit Testing：是否引入单元测试

  1. E2E Testing：是否引入end to end 测试

  • 回车之后有个选择是否存储本次项目配置，主要是方便下次创建项目时更快。

到此一个vue初始化项目创建完成。

avatar
文章
阅读
粉丝