搭建Vue3项目框架（自用）

路由router 一、安装路由 二、注册路由 在项目src/router目录下创建index.ts文件： 在index.ts中： 创建router/router.type.d.ts文件，它的作用是用来

CSS样式管理 css 预处理器 这里我们选择的是sass/scss 样式目录结构 常见的工作流是，全局样式都写在src/styles目录下，每个页面自己对应的样式都写在自己的.vue文件之中。 然后

配置模块路径别名 Vite官方提供了路径别名的配置项：resolve.alias 需要注意的是：当使用文件系统路径的别名时，请始终使用绝对路径。相对路径的别名值会原封不动地被使用，因此无法被正常解析。

git commit提交代码的规范 commitlint commitlint 检查您的提交消息是否符合常规提交格式。 根据commitlint-config-conventional （基于 Ang

在开发（dev）和构建（build）中进行代码规范校验 vite-plugin-eslint 安装 配置 vite.config.ts: 配置完成后记得重启项目 在打包构建的时候碰到了这个报错：Cou

配置git commit提交规范 在提交代码到git仓库之前，Eslint自动的去验证代码规范，防止不符合规范的代码提交到git仓库中。 安装lint-staged lint-staged的作用是针对

初始化项目 创建vue项目 输入命令后，填写项目的名称。选择使用的框架，这里是Vue，然后选择使用的语言，这里选的是TypeScript。 选择完毕后，进入到项目目录cd xxx，安装项目的初始依赖n

ESlint代码规范+Prettier格式化 vite创建的项目是默认没有集成ESLint的，所以我们需要手动去安装配置ESLint。 2.1 安装并配置 ESLint 2.2 验证项目中代码是否符合

在项目中配置快速生成Vue3模板的命令 在项目根目录的.vscode文件夹下新建 vue3.0.code-snippets文件 在vue3.0.code-snippets中将下面的代码片段复制粘贴进去