vue3项目创建及使用详解

【不推荐使用Default默认vue，尽量自己配置】

方法一：选择Manually select features进行自定义配置[推荐]

1. 进行个人需求详细配置

根据个人需求选择

• vue choose vue version(版本选择 v2x / v3x )
• Babel（转码器，可以将ES6代码转为ES5代码，从而在现有环境执行）
• TypeScript （支持使用 TypeScript 书写源码）
• Progressive Web App (PWA) Support （渐进式Web应用程序）
• Router （vue-router路由）
• Vuex （vue的状态管理模式）
• CSS Pre-processors （支持 CSS 预处理器）
• Linter / Formatter （支持代码风格检查和格式化）
• Unit Testing （支持单元测试）
• E2E Testing （支持 E2E 测试）

2. css预处理器
   node-sass是自动编译实时的（推荐），dart-sass需要保存后才会生效。

3. 代码风格、格式校验 根据个人需求

4. 测试

5. 配置放置地点

6. 结果

• cd vue_project
• npm run serve 运行成功后 安装node_modules依赖
  yarn / npm install

方法二： 使用vite创建vue项目【推荐】

可以通过官方方式创建

1. 全局安装安装Vite

npm install -g create-vite-app

2. 使用vite创建vue3项目

create-vite-app vuedemo

生成的项目很多配置都不存在，需要自己手动配置。