- 调整 #app 样式,移除默认的 margin 和 padding - 添加 header 和 footer 的样式类 - 优化模板结构,提高代码可读性 - 添加退出登录失败的提示消息 |
||
|---|---|---|
| .vscode | ||
| public | ||
| src | ||
| .eslintrc.cjs | ||
| .gitignore | ||
| .prettierrc | ||
| index.html | ||
| jsconfig.json | ||
| package.json | ||
| README.md | ||
| vite.config.js | ||
vue-project
This template should help get you started developing with Vue 3 in Vite.
Recommended IDE Setup
VSCode + Volar (and disable Vetur).
Customize configuration
See Vite Configuration Reference.
Project Setup
npm install
Compile and Hot-Reload for Development
npm run dev
Compile and Minify for Production
npm run build
Lint with ESLint
npm run lint
src
├─ assets # 静态资源 (图片、字体、全局样式等)
│ ├─ images
│ ├─ icons
│ └─ styles # 全局样式(variables.scss, reset.css...)
│
├─ components # 全局通用组件
│ ├─ common # 公共基础组件 (按钮、输入框、弹窗...)
│ ├─ layout # 页面框架相关组件 (导航栏、侧边栏...)
│ └─ widgets # 业务相关的小部件
│
├─ layouts # 页面整体布局 (BasicLayout.vue, BlankLayout.vue...)
│
├─ views # 页面级组件 (对应路由)
│ ├─ Home
│ ├─ Login
│ └─ Dashboard
│
├─ router # 路由配置
│ └─ index.ts
│
├─ stores # 状态管理 (Pinia / Vuex)
│ └─ user.ts
│
├─ utils # 工具函数 (request.ts, format.ts...)
│
├─ api # 接口请求 (user.ts, product.ts...)
│
├─ models # 类型声明 (TS 接口 / class)
│
├─ hooks # 自定义 hooks (useAuth.ts, useDarkMode.ts...)
│
├─ plugins # 插件配置 (element-plus.ts, i18n.ts...)
│
├─ directives # 自定义指令 (v-permission.ts...)
│
└─ App.vue