386f1345c3
- 添加项目配置文件：.vercelignore、.codex/config.toml、postcss.config.js、.prettierrc 等 - 设置构建工具链：Vite + React + TypeScript + TailwindCSS - 添加核心组件：HeaderBar、TierRow、ItemCard、Pool - 配置 CI/CD 和部署相关文件：vercel.json、DEPLOY.md - 添加开发工具配置：ESLint、Prettier、EditorConfig - 实现基础功能：拖拽排序、图片处理、状态管理
40 lines
1.9 KiB
Markdown
40 lines
1.9 KiB
Markdown
## 当前状态
|
||
- 技术栈：Vite + React + TypeScript（已存在 `package.json`, `vite.config.ts`）
|
||
- Vercel 配置：已存在 `vercel.json`（含 SPA 重写到 `index.html`）与 `.vercelignore`、`.vercel/project.json`
|
||
- 构建脚本：`npm run build` 输出到 `dist/`
|
||
|
||
## 改造目标
|
||
- 明确 Vercel 静态站点配置，确保自动检测稳健
|
||
- 完善忽略与环境变量约定，避免意外上传或路由异常
|
||
|
||
## 将进行的改动
|
||
1. 更新 `vercel.json`
|
||
- 明确声明：
|
||
- `framework: "vite"`
|
||
- `buildCommand: "npm run build"`
|
||
- `outputDirectory: "dist"`
|
||
- 保留现有 SPA 重写：`{"source":"/(.*)","destination":"/index.html"}`
|
||
2. 优化 `.vercelignore`
|
||
- 保留：`node_modules`, `.git`, `dist`, `build`, `.trae`, `.figma`
|
||
- 新增：`.env`, `.env.*`（避免上传本地环境文件）
|
||
3. 校正 Vite 基础路径（如需）
|
||
- 在 `vite.config.ts` 明确 `base: '/'`（当前默认即可，若将来挂子路径可再调整）
|
||
4. 部署与验证文档（新增简要说明）
|
||
- 使用 CLI：`vercel`（预览）、`vercel --prod`（生产）
|
||
- 仪表盘设置环境变量：使用 `VITE_*` 前缀（例如 `VITE_API_BASE`）
|
||
|
||
## 验证步骤
|
||
- 本地：`npm run build` 验证生成 `dist/`
|
||
- Vercel：自动检测 Vite，执行构建，路由通过 `rewrites` 走 `index.html`
|
||
- 访问任意深层路径（如 `/pool/123`），确认前端路由正常
|
||
|
||
## 交付物
|
||
- `vercel.json`（更新为包含 framework/buildCommand/outputDirectory + rewrites）
|
||
- `.vercelignore`（新增环境变量忽略项）
|
||
- `vite.config.ts`（如需，补充 `base: '/'`）
|
||
- `DEPLOY.md`（简要部署与环境变量约定说明）
|
||
|
||
## 影响与说明
|
||
- 构建与运行逻辑不变；仅提升 Vercel 适配与稳定性
|
||
- 不提交任何秘钥；环境变量在 Vercel 仪表盘设置
|
||
- 若后续引入服务端 API，可在 `api/` 目录添加 Serverless Functions 并扩展 `vercel.json` 路由 |