%20(2).svg)
项目简介
此项目是一个基于 Vite、Vue3 和 TypeScript 的开箱即用现代开发模板。整合众多实用功能与配置，能帮助开发者节省项目配置时间，以更现代的方式开发 Web 应用，提高开发效率。
项目的主要特性和功能
- 构建与框架：采用 Vite 构建工具，结合 Vue3 框架，支持 TypeScript 开发。
- 路由与布局：有文件路由，目录结构即路由；具备布局系统，支持默认和非默认布局。
- 模拟与请求：支持 Mock 数据，可在开发环境模拟后端接口；提供 SWR 请求方式，用 vue - request 库简化请求处理；封装全局通用的 axios 请求。
- 自动引入：实现 Api、组件、图标自动引入，减少手动 import 操作。
- 状态管理：使用 pinia 进行状态管理，替代 vuex。
- 样式与模式：支持 unocss 原子 CSS 库，简化样式编写；具备暗黑模式切换功能。
- 开发辅助：提供跳转进度条、开发面板；支持插件自动加载；具备 Vitest 单元测试及报告生成；支持 Markdown 渲染；提供路径别名；支持命令行自动创建与删除模块或组件。
- 国际化与错误处理：支持 i18n 国际化；提供漂亮的 404 页面。
- 其他特性：支持 tsx 文件；具备 gzip 资源压缩；支持环境变量配置；统一代码规范与风格；自动移除生产环境开发日志；支持 defineOptions；集成 echarts 用于图表展示；提供全局通用 toast 通知；自动生成环境变量类型声明；使用 renovate 自动更新依赖；自动更新版本并生成 CHANGELOG；提供最快最小的 dockerfile 静态 go 服务。
安装使用步骤
前提条件
建议使用 node 当前的长期维护版本 v18，且仅支持 pnpm 包管理器，可参考 安装教程 进行安装。
复制模板
- Gitee：
git clone git@gitee.com:dishait/tov-template.git
项目操作
- 安装依赖：
pnpm install - 开发
- 启动开发环境：
pnpm dev - 开启 host：
pnpm dev:host - 自动打开浏览器：
pnpm dev:open
- 启动开发环境：
- 预览
- 预览项目：
pnpm preview - 开启 host：
pnpm preview:host - 自动打开浏览器：
pnpm preview:open
- 预览项目：
- 打包
- 常规打包：
pnpm build - 调试打包：
pnpm build:debug
- 常规打包：
- 单元测试
- 执行单元测试：
pnpm test - 生成单元测试报告：
pnpm coverage
- 执行单元测试：
- 类型检查：
pnpm typecheck - 自动创建：
pnpm auto:create - 自动移除：
pnpm auto:remove - 依赖更新
- 更新依赖版本：
pnpm deps:fresh - 重新安装依赖：
pnpm i
- 更新依赖版本：
- 代码规范校验
- 执行校验：
pnpm lint - 校验并修复：
pnpm lint:fix
- 执行校验：
下载地址
点击下载 【提取码: 4003】【解压密码: www.makuang.net】