# vue-project

This template should help get you started developing with Vue 3 in Vite.

## Recommended IDE Setup

[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).

## Customize configuration

See [Vite Configuration Reference](https://vitejs.dev/config/).

## Project Setup

```sh
npm install
```

### Compile and Hot-Reload for Development

```sh
npm run dev
```

### Compile and Minify for Production

```sh
npm run build
```

### Lint with [ESLint](https://eslint.org/)

```sh
npm run lint
```

```angular2html
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
```