feat: 完善全栈打包质量门禁
在业务开发前补齐 lint、format、verify 与生产运行时契约,确保开发联调和 executable 打包链路可重复验证。
This commit is contained in:
40
README.md
40
README.md
@@ -28,6 +28,12 @@ bun run dev
|
||||
|
||||
开发期请打开 Vite 前端地址。前端通过相对路径 `/api/demo` 调用后端,Vite 会把 `/api/*` 代理到 Bun 后端,因此浏览器不需要 CORS 配置。
|
||||
|
||||
全栈开发命令使用 `PORT` 作为后端端口覆盖来源,并将同一端口传给 Vite proxy:
|
||||
|
||||
```bash
|
||||
PORT=4000 bun run dev
|
||||
```
|
||||
|
||||
也可以分别运行:
|
||||
|
||||
```bash
|
||||
@@ -35,6 +41,29 @@ bun run dev:server
|
||||
bun run dev:web
|
||||
```
|
||||
|
||||
分别运行时,若后端不是默认 `3000` 端口,需要为 Vite 指定同一个后端端口:
|
||||
|
||||
```bash
|
||||
PORT=4000 bun run dev:server
|
||||
BACKEND_PORT=4000 bun run dev:web
|
||||
```
|
||||
|
||||
## 代码质量
|
||||
|
||||
```bash
|
||||
bun run lint
|
||||
bun run format:check
|
||||
bun run format
|
||||
bun run check
|
||||
```
|
||||
|
||||
- `lint` 使用 ESLint 检查 TypeScript、React Hooks 和前后端边界。
|
||||
- `format:check` 使用 Prettier 检查代码格式。
|
||||
- `format` 使用 Prettier 重写受管理文件格式。
|
||||
- `check` 依次运行 `typecheck`、`lint`、`format:check` 和单元测试,适合日常开发期间快速验证。
|
||||
|
||||
Prettier 不格式化 `openspec/`、`dist/`、`.build/`、`node_modules/`、`bun.lock` 和临时构建产物。
|
||||
|
||||
## Demo 验证
|
||||
|
||||
开发期打开 `http://127.0.0.1:5173`,页面应显示 `/api/demo` 返回的后端 message、Bun 版本、平台和响应时间。
|
||||
@@ -56,6 +85,7 @@ bun run build
|
||||
|
||||
- 运行 `vite build`,输出前端资源到 `dist/web`
|
||||
- 生成临时 `.build/static-assets.ts`,用 Bun file import 嵌入 Vite 产物
|
||||
- 生成临时 `.build/server-entry.ts`,作为生产 executable 的 server 入口
|
||||
- 运行 `Bun.build({ compile })`,输出 `dist/gateway-checker`
|
||||
|
||||
运行 executable:
|
||||
@@ -83,13 +113,13 @@ PORT=4000 ./dist/gateway-checker
|
||||
## 测试
|
||||
|
||||
```bash
|
||||
bun run typecheck
|
||||
bun test
|
||||
bun run build
|
||||
bun run test:smoke
|
||||
bun run check
|
||||
bun run verify
|
||||
```
|
||||
|
||||
`test:smoke` 会启动生成的 executable,并检查 `/api/demo`、`/health`、前端根路径、静态资源和 SPA fallback。
|
||||
- `check` 适合日常开发,包含类型检查、lint、格式检查和单元测试。
|
||||
- `verify` 适合提交前或发布前,先运行 `check`,再重新构建生产 executable 并运行 smoke test。
|
||||
- `test:smoke` 会启动生成的 executable,并检查 `/api/demo`、`/health`、前端根路径、静态资源、未知 API、未知静态资源、生产模式、缓存响应头、低风险安全响应头和 SPA fallback。
|
||||
|
||||
## 前后端边界
|
||||
|
||||
|
||||
Reference in New Issue
Block a user