feat: 前端集成 Prettier 代码格式化

openspec/specs/frontend-lint-rules/spec.md

@@ -49,18 +49,20 @@ TBD - 定义前端 ESLint 规则配置、构建集成 lint 检查、以及自定
 
 ### Requirement: 构建集成 lint 检查
 
-前端 SHALL 在 `build` 命令中集成 ESLint 检查。
+前端 SHALL 在 `build` 命令中集成 ESLint 检查和 Prettier 格式检查。
 
-#### Scenario: 构建时执行 lint
+#### Scenario: 构建时执行 lint 和格式检查
 
 - **WHEN** 执行 `bun run build`
-- **THEN** 构建 SHALL 依次执行 `tsc -b`、`eslint .`、`vite build`
+- **THEN** 构建 SHALL 依次执行 `tsc -b`、`bun run check`、`vite build`
+- **THEN** `bun run check` SHALL 执行 `bun run lint && bun run format:check`
 - **THEN** 若 `eslint .` 报告任何错误，构建 SHALL 中断
+- **THEN** 若 `prettier --check .` 报告任何格式问题，构建 SHALL 中断
 
 #### Scenario: lint 警告不中断构建
 
 - **WHEN** `eslint .` 仅报告警告（无错误）
-- **THEN** 构建 SHALL 继续执行 `vite build`
+- **THEN** 构建 SHALL 继续执行格式检查和 `vite build`
 
 #### Scenario: 单独执行 lint
 
@@ -72,6 +74,19 @@ TBD - 定义前端 ESLint 规则配置、构建集成 lint 检查、以及自定
 - **WHEN** 执行 `bun run lint:fix`
 - **THEN** SHALL 运行 `eslint . --fix`
 
+#### Scenario: 统一检查命令
+
+- **WHEN** 执行 `bun run check`
+- **THEN** SHALL 运行 `bun run lint && bun run format:check`
+- **THEN** lint 错误和格式问题 SHALL 都被检查
+
+#### Scenario: 统一修复命令
+
+- **WHEN** 执行 `bun run fix`
+- **THEN** SHALL 运行 `bun run lint:fix && bun run format`
+- **THEN** lint 问题 SHALL 被修复
+- **THEN** 文件 SHALL 被格式化
+
 ### Requirement: 自定义规则禁止硬编码颜色
 
 前端 SHALL 提供自定义 ESLint 规则 `no-hardcoded-color-in-style`，检测 JSX style 属性中的硬编码颜色值。
@@ -112,3 +127,14 @@ TBD - 定义前端 ESLint 规则配置、构建集成 lint 检查、以及自定
 - **THEN** 规则文件 SHALL 放置在 `frontend/eslint-rules/` 目录下
 - **THEN** `eslint.config.js` SHALL 通过相对路径引用本地插件
 - **THEN** 自定义规则 SHALL NOT 作为 npm 包发布
+
+### Requirement: ESLint 与 Prettier 集成配置
+
+前端 SHALL 在 `eslint.config.js` 中集成 `eslint-config-prettier`，确保 ESLint 和 Prettier 职责分离且不冲突。
+
+#### Scenario: 职责分离
+
+- **WHEN** 检查代码
+- **THEN** ESLint SHALL 负责代码质量检查（如未使用变量、语法错误）
+- **THEN** Prettier SHALL 负责代码格式化（如缩进、引号、分号）
+- **THEN** 两者 SHALL NOT 重复检查同一规则