63 lines
1.9 KiB
Markdown
63 lines
1.9 KiB
Markdown
# Schedule Invest Plan
|
||
|
||
Vue 3 + TypeScript 前端项目，技术栈：Vite、Vue Router、Pinia、Axios、vue-i18n、Sass、Element Plus。
|
||
|
||
## 开发
|
||
|
||
```bash
|
||
npm install
|
||
npm run dev
|
||
```
|
||
|
||
## 构建
|
||
|
||
```bash
|
||
npm run build
|
||
npm run preview
|
||
```
|
||
|
||
## 目录说明
|
||
|
||
| 路径 | 说明 |
|
||
|------|------|
|
||
| `src/api/http.ts` | Axios 实例与拦截器 |
|
||
| `src/i18n/` | 国际化配置（简体 / 繁体 / 英文） |
|
||
| `src/router/` | 路由 |
|
||
| `src/stores/` | Pinia 状态 |
|
||
| `src/styles/` | 全局 Sass 与变量 |
|
||
| `src/views/RecurringInvestmentView.vue` | 定期投资首页 |
|
||
| `src/element-plus/locale.ts` | Element Plus 语言与 URL `lang` 映射 |
|
||
| `src/types/components.d.ts` | 组件自动导入类型（构建生成） |
|
||
|
||
### Element Plus
|
||
|
||
- 通过 `unplugin-vue-components` + `unplugin-auto-import` 按需引入组件。
|
||
- 根节点 `el-config-provider` 语言随 URL `lang` 同步（简/繁/英）。
|
||
- 深色模式：`theme=dark` 时为 `html` 增加 `dark` 类，并加载 Element Plus 深色 CSS 变量。
|
||
|
||
## 环境变量
|
||
|
||
开发环境见 `.env.development`：`VITE_API_BASE_URL` 为接口基础路径（默认 `/api`）。
|
||
|
||
## URL 参数（语言与主题）
|
||
|
||
语言与主题**仅通过 URL 查询参数**控制（不再使用 `localStorage`）。
|
||
|
||
| 参数 | 取值 | 缺省 |
|
||
|------|------|------|
|
||
| `lang` | `zh-TW` / `zh-CN` / `en-US`（亦支持 `locale`） | `zh-TW` |
|
||
| `theme` | `dark` / `light`（亦支持 `night` / `day`） | `dark` |
|
||
|
||
示例：
|
||
|
||
- `http://localhost:5173/?lang=zh-TW&theme=dark`
|
||
- `http://localhost:5173/?lang=en-US&theme=light`
|
||
|
||
顶栏切换语言或主题时会同步更新当前地址栏中的 `lang`、`theme`。
|
||
|
||
## PC / 移动端适配
|
||
|
||
开发与评审须遵循 **[docs/RESPONSIVE_SPEC.md](./docs/RESPONSIVE_SPEC.md)**（断点、布局壳层、Sass mixin、`useBreakpoint`、Element Plus 栅格与表单约定）。
|
||
|
||
Cursor 已配置项目规则：`.cursor/rules/`（核心约定、响应式、Vue SFC 写法）。
|