%20(2).svg)
项目简介
本项目是一个基于Vite、Vue3和TypeScript的开箱即用现代开发模板。该模板集成了众多实用的功能与特性，旨在帮助开发者节省项目配置时间，以更现代的方式开发Web应用，提高开发效率。
项目的主要特性和功能
- 构建与框架：采用Vite作为构建工具，结合Vue3框架与TypeScript类型系统，提供高效的开发与构建体验及类型检查。
- 路由与布局：支持文件路由，目录结构即路由；具备布局系统，可自定义或使用默认布局。
- 数据模拟与请求：提供Mock支持，可模拟后端API数据；支持SWR请求方式，实现数据预取和增量更新。
- 自动引入：支持Api、组件、图标自动引入，减少手动导入的繁琐。
- 实用工具与状态管理：集成VueUse实用库，使用pinia进行状态管理。
- 样式与主题：采用Windi CSS，支持暗黑模式，提供原子CSS和排版插件。
- 调试与测试：有Inspect调试支持，提供项目依赖图谱；支持Vitest单元测试及测试报告生成。
- 其他特性：支持Markdown渲染、i18n国际化、tsx语法、gzip资源压缩、环境变量配置；具备跳转进度条、漂亮的404页；提供命令行自动创建与删除功能；统一代码规范与风格，生产环境自动移除开发日志，支持defineOptions。
安装使用步骤
假设用户已经下载了本项目的源码文件，可按以下步骤操作：
1. 安装依赖：不限定包管理器，可使用pnpm install或npm install或yarn。强烈推荐使用pnpm，若未安装，可参考安装教程。
2. 开发
- 常规开发：pnpm dev或npm run dev或yarn dev。
- 开启host：pnpm dev:host或npm run dev:host或yarn dev:host。
- 自动打开浏览器：pnpm dev:open或npm run dev:open或yarn dev:open。
3. 预览
- 常规预览：pnpm preview或npm run preview或yarn preview。
- 开启host：pnpm preview:host或npm run preview:host或yarn preview:host。
- 自动打开浏览器：pnpm preview:open或npm run preview:open或yarn preview:open。
4. 打包：使用pnpm build或npm run build或yarn build。
5. 单元测试：使用pnpm test或npm run test或yarn test。
6. 单元测试报告生成：使用pnpm coverage或npm run coverage或yarn coverage。
7. 样式报告预览：使用pnpm analysis或npm run analysis或yarn analysis。
8. 样式报告打包：使用pnpm analysis:build或npm run analysis:build或yarn analysis:build。
9. 类型检查：使用pnpm typecheck或npm run typecheck或yarn typecheck。
10. 自动创建：使用pnpm auto:create或npm run auto:create或yarn auto:create。
11. 自动移除：使用pnpm auto:remove或npm run auto:remove或yarn auto:remove。
12. 依赖更新
- 安全版本更新：pnpm deps:fresh或npm run deps:fresh或yarn deps:fresh。
- 主版本更新（谨慎使用，可能有破坏性更新）：pnpm deps:fresh:major或npm run deps:fresh:major或yarn deps:fresh:major。
- 次版本更新（谨慎使用，可能有破坏性更新）：pnpm deps:fresh:minor或npm run deps:fresh:minor或yarn deps:fresh:minor。
- 补丁版本更新：pnpm deps:fresh:patch或npm run deps:fresh:patch或yarn deps:fresh:patch。
上述依赖更新命令仅对package.json写入，需重新执行包安装命令，如pnpm i或npm i或yarn。
13. 代码规范校验
- 校验：pnpm lint或npm run lint或yarn lint。
- 校验并修复：pnpm lint:fix或npm run lint:fix或yarn lint:fix。
下载地址
点击下载 【提取码: 4003】【解压密码: www.makuang.net】