目录结构 ​

my-app/
├── public/ # 静态资源目录（不经过 Vite 打包，直接复制到 dist 根目录）
│ └── config.js # 生产环境全局配置文件
├── scripts/ # 项目工程化构建与脚手架辅助脚本
│ ├── clean.mjs # 清理打包产物脚本
│ ├── generate-api.mjs # API 接口自动生成脚本
│ └── generate-config.mjs # 配置文件自动生成脚本
├── typings/ # 全局 TypeScript 类型声明目录
├── src/ # 源代码核心目录
│ ├── api/ # 后端接口定义（按模块划分，如 user.ts, client.ts）
│ ├── assets/ # 静态资源，包括 images（图片）、icons（本地 SVG 图标）、brand（品牌标识）
│ ├── components/ # 基础及全局业务组件（如上传、富文本编辑器、时区选择器等）
│ ├── config/ # 系统全局配置（包括 settings 设置、dark-mode 暗黑模式、menu 菜单等）
│ ├── enums/ # 系统通用枚举值定义（缓存 Key、路由 Page、网络请求等）
│ ├── hooks/ # 自定义组合式生命周期逻辑（Hooks，如分页、路由监听、防重复提交等）
│ ├── install/ # 全局插件（Plugins）与指令（Directives）的注册与初始化
│ ├── layout/ # 页面布局组件（系统的主体 Layout 框架）
│ ├── locales/ # 多语言国际化 JSON 翻译文件（中文、英文、俄文等）
│ ├── router/ # 路由配置（包括路由守卫 guard、路由表定义 routes.ts）
│ ├── stores/ # Pinia 状态管理模块（实现多页签、用户信息、应用配置的存储）
│ ├── styles/ # 样式管理中心（Tailwind CSS 引入、Element Plus 主题定制、全局变量）
│ ├── utils/ # 常用工具函数（本地存储、网络请求 Axios 封装、通知反馈 feedback 等）
│ ├── views/ # 具体业务页面视图（按功能模块分，如仪表盘 dashboard、用户角色 user-role、演示 demo 等）
│ ├── App.vue # 应用根组件
│ ├── main.ts # 应用入口文件
│ └── permission.ts # 权限校验与页面拦截控制逻辑
├── index.html # 应用单页（SPA）HTML 模板入口
├── package.json # NPM 包信息与运行脚本配置
├── vite.config.ts # Vite 核心构建与开发服务器配置文件
├── tsconfig.json # TypeScript 编译器配置文件
├── eslint.config.mjs # ESLint 编码规约检查配置
├── oxlint.config.mjs # Oxlint 快速代码检查配置
├── oxfmt.config.mjs # Oxfmt 极速格式化配置
├── stylelint.config.mjs # Stylelint 样式代码检查配置
├── plopfile.cjs # Plop 脚手架模块自动生成配置文件
└── plop-templates/ # Plop 脚手架文件生成模版（API、编辑页、列表页模板）