%20(2).svg)
项目简介
本项目是一个基于Vite、Vue3和TypeScript的现代开发模板，旨在节省开发时的配置时间，通过整合主流插件构建现代开发架构，从而提升开发效率。适合不想在项目配置上浪费时间，希望以更现代方式开发Web应用的开发者。
项目的主要特性和功能
- 构建与框架：采用Vite作为构建工具，运用Vue3框架，支持TypeScript。
- 路由与布局：具备文件路由，目录结构即为路由；拥有布局系统，可设置默认和非默认布局。
- 模拟与请求：支持Mock数据，可在mock目录定义接口；提供SWR请求方式，使用vue - request库。
- 自动引入：支持Api、组件、图标自动引入，减少手动导入工作量。
- 状态管理：使用pinia进行状态管理，简单易用且对TypeScript支持良好。
- 样式与主题：集成unocss原子CSS库，支持暗黑模式。
- 开发辅助：有跳转进度条、开发面板，支持插件自动加载。
- 测试与规范：支持Vitest单元测试，具备统一的代码规范与风格，有commit时校验。
- 其他功能：支持Markdown渲染、路径别名、命令行自动创建与删除、i18n国际化、漂亮的404页、tsx、gzip资源压缩、环境变量配置、自动生成环境变量类型声明、renovate自动更新依赖、自动版本更新并生成CHANGELOG，还集成了echarts、全局通用toast通知和全局通用axios请求封装。
安装使用步骤
前提条件
确保已安装pnpm包管理器，推荐使用node的长期维护版本v18。
复制项目
可选择以下方式复制模板：
- Gitee
shell
git clone git@gitee.com:dishait/tov-template.git
安装依赖
shell
pnpm install
开发
- 启动开发服务器
shell pnpm dev - 开启host
shell pnpm dev:host - 自动打开浏览器
shell pnpm dev:open
预览
- 启动预览服务器
shell pnpm preview - 开启host
shell pnpm preview:host - 自动打开浏览器
shell pnpm preview:open
打包
- 打包项目
shell pnpm build - 调试打包
shell pnpm build:debug
单元测试
- 运行单元测试
shell pnpm test - 生成单元测试报告
shell pnpm coverage
类型检查
shell
pnpm typecheck
自动创建与移除
- 自动创建页面或组件
shell pnpm auto:create - 自动移除页面或组件
shell pnpm auto:remove
依赖更新
- 更新依赖版本
shell pnpm deps:fresh - 重新执行包安装命令
shell pnpm i
代码规范校验
- 运行代码规范校验
shell pnpm lint - 校验时修复问题
shell pnpm lint:fix
下载地址
点击下载 【提取码: 4003】【解压密码: www.makuang.net】