vue-cli3学习整理----创建项目选项说明

时间:2022-09-25 00:21:15
vue create [项目名称]

 提示选择一个preset(预置项),或自定义:

vue-cli3学习整理----创建项目选项说明

选择自定义选项:

vue-cli3学习整理----创建项目选项说明

全选,看看都有什么?

vue-cli3学习整理----创建项目选项说明

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

vue-cli3学习整理----创建项目选项说明

是否使用Babel为TypeScript做转义?Y

vue-cli3学习整理----创建项目选项说明

路由是否使用History模式?Y

vue-cli3学习整理----创建项目选项说明

选择一种CSS预处理:Less (如果安装Sass/SCSS,需要本地预先安装python)

vue-cli3学习整理----创建项目选项说明

选择一种TypeScript格式化规范类型:ESLint + Prettier

vue-cli3学习整理----创建项目选项说明

保存时检测 还是 提交时检测并修复:Lint on save

vue-cli3学习整理----创建项目选项说明

选择一种单元测试方案:Jest

vue-cli3学习整理----创建项目选项说明

选择一种E2E(端对端)测试方案:Cypress(只在Chrome浏览器上测试)

vue-cli3学习整理----创建项目选项说明

将以上配置存放到哪里?In dedicated config files (单独文件中)

vue-cli3学习整理----创建项目选项说明

是否保存为preset(预设项,以后可以使用的,就不用像这样再一步一步来):Y

 vue-cli3学习整理----创建项目选项说明

保存preset为(给预置项个名字):All

之后系统自动安装项目并生成preset(预置项)

vue-cli3学习整理----创建项目选项说明

vue-cli3学习整理----创建项目选项说明

vue-cli3学习整理----创建项目选项说明

 项目目录结构:

vue-cli3学习整理----创建项目选项说明

可以看到项目是使用TypeScript编写,如果想使用JavaScript编辑,在安装选项时不选择TypeScript即可。