develop → main: 合并开发分支 (#51)
* fix(ci): fix release workflow artifact upload issue - Split artifact upload into 3 separate steps (Chrome, Firefox, Source) - Update download steps to match new artifact names - Add if-no-files-found: error for better error handling - Fix Node.js 20 compatibility issue with upload-artifact@v4 glob pattern * docs: 更新 AGENTS.md,添加测试工具和翻译文件结构说明 * docs: 更新 AGENTS.md,完善 CI 步骤和存储键名格式说明 * fix: remove unnecessary animations from StorageCleaner page - Remove entrance animations (animate-in, fade-in, zoom-in) from all components - Remove scale effect (active:scale-[0.99]) from clean button - Remove transition effects (transition-all, transition-colors) from OptionItem, StorageOptionsGrid, AutoRefreshToggle - Remove bouncing animation from error icon - Remove pulsing animation from warning banner - Keep animate-spin on button loading spinner as functional indicator * fix: remove unnecessary animations from RightClickRestorer page * fix: remove all unnecessary animations from all pages - Remove dead code animations (animate-in, fade-in, slide-in, zoom-in, shake) from tailwindcss-animate plugin (not installed) - Remove decorative transition effects (transition-all, transition-colors) from all page components - Remove scale effects (active:scale-95) from buttons - Remove bounce animations (animate-bounce) from icons - Keep functional animate-spin on loading spinners as they provide essential loading feedback Affected pages: Dashboard, Timestamp, Jwt, JsonTools, Base64Converter, HtmlToMarkdown, MarkdownToHtml, QrCode, TextStatistics --------- Co-authored-by: Ubuntu <ubuntu@localhost.localdomain>
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
# AGENTS.md
|
||||
|
||||
WXT 浏览器扩展项目 (React 19 + TypeScript)。
|
||||
WXT 浏览器扩展项目 (React 19 + TypeScript)。提供时间戳转换、存储清理、JWT 解析、JSON 工具、二维码、Base64、Markdown 等测试效率工具。
|
||||
|
||||
## 核心命令
|
||||
|
||||
@@ -22,14 +22,17 @@ npm run test:coverage # 带覆盖率的测试
|
||||
|
||||
## 验证流程
|
||||
|
||||
CI 执行顺序: `setup → lint/typecheck/test(并行) → build` (build 依赖前三者)。
|
||||
CI 步骤(严格顺序,任一步骤失败则停止并标记 CI 失败):
|
||||
|
||||
Pre-commit hook (`.husky/pre-commit` 调用 `lint-staged`):
|
||||
1. `setup`(安装依赖、`wxt prepare`)
|
||||
2. 并行运行 `lint`、`typecheck`、`test`(三者全部通过才继续)
|
||||
3. `build`(仅当步骤 2 全部成功时执行)
|
||||
|
||||
- 代码文件 (`*.{ts,tsx,js,jsx,mjs}`): `eslint --fix --max-warnings=0 --no-warn-ignored` → `prettier --write`
|
||||
- 其他文件 (`*.{json,css,scss,md}`): `prettier --write`
|
||||
Pre-commit hook(`.husky/pre-commit` 调用 `lint-staged`,任一步骤返回非零则终止提交):
|
||||
|
||||
提交前确保 `lint` 和 `typecheck` 通过。
|
||||
1. 代码文件 (`*.{ts,tsx,js,jsx,mjs}`):运行 `eslint --fix --max-warnings=0 --no-warn-ignored`;若失败则终止并报告错误
|
||||
2. 同一代码文件:运行 `prettier --write`
|
||||
3. 其他文件 (`*.{json,css,scss,md}`):运行 `prettier --write`
|
||||
|
||||
## WXT 生成文件
|
||||
|
||||
@@ -54,10 +57,12 @@ i18n/locales/{zh,en}/ # 国际化资源 (common.json, features.json 及各功
|
||||
## 关键架构决策
|
||||
|
||||
**路由**: 不使用 React Router。通过 `config/features.tsx` 的 `FEATURES` 数组管理,`RouterProvider` 根据 `PageType`
|
||||
渲染对应组件。支持三种渲染模式: popup / sidepanel / tab。
|
||||
渲染对应组件。支持三种渲染模式:popup(弹窗)、sidepanel(侧边栏)和 browser-tab(浏览器新标签页,通过 `open_in_tab` 打开)。
|
||||
每种模式有独立的路由和可见页面配置。
|
||||
|
||||
**存储**: 所有 Chrome Storage 键必须在 `types/storage.d.ts` 的 `StorageSchema` 中定义。使用 `utils/chromeStorage.ts` 及其
|
||||
Hook。Router 同时使用 `chrome.storage.local` 和 `localStorage` 做快照以消除首屏闪烁。
|
||||
**存储**: 所有 Chrome Storage 键必须在 `types/storage.d.ts` 的 `StorageSchema` 中定义,键名使用 kebab-case 格式(如 `app/currentRoute`)。
|
||||
使用 `utils/chromeStorage.ts` 及其 Hook。Router 同时使用 `chrome.storage.local` 和 `localStorage` 做快照以消除首屏闪烁。
|
||||
修改 StorageSchema 时,必须在 `utils/chromeStorage.ts` 添加版本迁移函数,并在测试中覆盖迁移场景。
|
||||
|
||||
**通信**: 使用 `@webext-core/messaging`,协议定义在 `utils/messages.ts`。
|
||||
|
||||
@@ -75,13 +80,21 @@ Hook。Router 同时使用 `chrome.storage.local` 和 `localStorage` 做快照
|
||||
- `@/utils/useLazyTranslation` (返回 `ns:key` 格式翻译)
|
||||
- `window.matchMedia`
|
||||
- 测试文件命名: `__tests__/*.test.{ts,tsx}` 或 `*.test.{ts,tsx}`
|
||||
- Mock 模式: 使用 `vi.mock()` 进行模块级 mock,避免在测试文件中重复 mock 代码
|
||||
- 测试工具: `@testing-library/react` + `@testing-library/user-event` 进行组件测试
|
||||
|
||||
## i18n
|
||||
|
||||
- 命名空间: `common` (默认), `features`
|
||||
- 翻译键格式: `namespace:key` (如 `features:timestamp.title`)
|
||||
- 语言: `zh` (默认), `en`
|
||||
- 翻译文件结构:
|
||||
- `i18n/locales/{zh,en}/common.json` - 全局通用翻译
|
||||
- `i18n/locales/{zh,en}/features.json` - 功能模块标题和描述
|
||||
- `i18n/locales/{zh,en}/{功能名}.json` - 各功能独立翻译(如 timestamp.json, storageCleaner.json 等)
|
||||
- 添加新翻译: 编辑 `i18n/locales/{zh,en}/{common,features}.json` 及对应功能独立 JSON
|
||||
- 使用 `useLazyTranslation` hook 加载功能独立翻译,返回 `ns:key` 格式
|
||||
- 回退策略: 当翻译 key 在目标语言缺失时,回退到默认语言 `zh`;若默认语言也缺失,返回占位格式 `namespace:key` 并在开发模式下记录 warning
|
||||
|
||||
## 新功能开发清单
|
||||
|
||||
@@ -97,6 +110,8 @@ Hook。Router 同时使用 `chrome.storage.local` 和 `localStorage` 做快照
|
||||
- 禁止使用 `any` (测试文件除外)
|
||||
- 未使用变量/参数: 使用 `_` 前缀 (如 `_unused`)
|
||||
- 样式: 使用 Tailwind CSS + shadcn/ui (通过 `className` 和 `cn()` 工具)
|
||||
- UI 组件: 优先使用 `components/ui/` 下的 shadcn/ui 组件 (button, dialog, select 等)
|
||||
- 图标: 使用 `lucide-react` 图标库
|
||||
- 格式: Prettier (`.prettierrc`: 100 字符宽, 单引号, 尾逗号 all, LF 换行)
|
||||
- ESLint 使用 `typescript-eslint` 的 `projectService: true`(无需手动维护 project 路径)
|
||||
|
||||
@@ -109,3 +124,6 @@ Hook。Router 同时使用 `chrome.storage.local` 和 `localStorage` 做快照
|
||||
- TypeScript: ^5.9.3
|
||||
- Vitest: ^4.1.7
|
||||
- i18next: ^26.2.0
|
||||
- @dnd-kit (拖拽排序)
|
||||
- marked (Markdown 解析)
|
||||
- qrious + qr-scanner (二维码生成与解析)
|
||||
|
||||
Reference in New Issue
Block a user