Vue 3 + TypeScript + Vite

# 安装依赖
pnpm i
# 启动项目
pnpm dev
# 启动文档
pnpm dev:docs

---

Include

• vue3
• ts
• vite
• vueRouter
• pinina
• axios
• lodash-es
• dayjs, date-fns
• js-cookie
• mock
• eslint(antfu)

• husky

• vueUse
• vitest

---

Task List

• 全局loading 进度

axios

• axios封装
  • get
  • post
  • put
  • delete
  • uploadFile
  • downloadFile

router

• router permission guard
• basic router
• router component patch
• add sort attribute to meta(尝试增加排序)
• add keep-alive
• 404 page

Layout

common

• ConfigDrawer
• GlobalContent

base Layout

• login page
  • Form
  • UI
• sidebar
  • hooks: useIconHeader
  • helper: menuHelper
  • collapse
• header
  • collapse
• Tab
  • Tab Context Menu
  • reload page
  • close page
• content

component layout

• 自定义布局白板 (大屏 / 自定义路由菜单展示方式)

theme

• sidebar
  • logo
• header
• tab -> ( div-> button)
• naive ui theme
  • common
• colorMode: ( light / dark )

Store

• userStore
  • token(cookie)
• permission (router)
• appStore

components

• svgIcon封装
• echarts
• Form
  • (是否存在优化: schema 配置项中的 component 改成组件导入的形式而不是 string, 可以配合 unplugin-auto-import 插件自动导入;)
• Table
  • 增加自定义列操作
• Descriptions
  • TODO (缺少类型提示;形式也不够优雅)
• 高德的地图
• MessageBox
• Upload (可写)

vite config

• proxy

Vitest

• add test case

plugins

• mock
• vite-plugin-svg-icons
• unplugin-vue-components
• vite-plugin-html
• vite-plugin-imagemin
• vite-plugin-pwa

---

mock

• login
  • token
  • userInfo
• router
  • test router

---

系统管理页面

• 账号管理
• 角色管理
• 权限配置

组件页面

• FormGenerate
• TableGenerate
• Descriptions
• 地图组件（高德）