切换至深色主题
AI Coding Agent
TIP
AI 时代，能否将模糊的业务需求拆解为清晰、可执行的技术任务，比编码能力更重要。好的任务描述 = 清晰的目标 + 明确的约束 + 可验证的验收标准。
基本概况
开发者AI能力跃迁
阶段一：辅助编码
AI 作为代码补全和片段生成工具，提升编码速度。开发者仍主导全部决策，AI 仅提供建议。
阶段二：任务级协作
AI 可独立完成模块级任务，开发者负责需求拆解和结果审查。从「写代码」转向「审代码」。
阶段三：Agent 全流程协同
Agent 自动解析需求文档，拆解为子任务，分配对应工具，集成测试验证，开发者仅需把控方向和质量。
架构师思维
架构方向、技术选型等需要人来把控。
IDE、VSCode插件、终端CLI
Cursor（Anysphere）
安装配置
基础配置
工具指令
规则目录
your-project/
├─ .cursor
│ ├─ .cursorrules # Workspace rulesClaude Code（Anthropic）
安装配置
基础配置
工具指令
Windsurf
安装配置
基础配置
工具指令
规则目录
GitHub Copilot Agent
安装配置
基础配置
工具指令
规则目录
Qoder
安装配置
基础配置
工具指令
TraeCode
安装配置
基础配置
工具指令
- 将 Figma 设计稿转化为前端代码：https://docs.trae.cn/ide_tutorial-mcp-figma
CodeBuddy
CodeBuddy IDE 构建一个产品、设计、研发无缝协作的共生环境。通过将 AI 深度融入从需求规划、产品设计到代码开发的全流程，实现从一个从想法到产品发布的一站式高效交付平台。
IDE
插件
CLI
环境要求：Node.js 18.0+
# 安装 CodeBuddy CLI
npm install -g @tencent-ai/codebuddy-code
# 验证
codebuddy --version核心命令
# --------------------------------------------------------------------------------------
命令 说明
# --------------------------------------------------------------------------------------
codebuddy 启动交互式 REPL
codebuddy "查询" 带初始提示词进入 REPL
codebuddy -p "查询" 单次执行（打印模式），跑完退出，适合脚本 / CI
cat 文件 | codebuddy -p "查询" 处理管道输入（如分析日志）
codebuddy -c 继续最近的对话
codebuddy -c -p "查询" 以单次模式继续对话
codebuddy -r "<会话ID>" "查询" 通过 ID 恢复指定会话
codebuddy update 更新到最新版本
codebuddy mcp 配置 MCP 服务器
codebuddy agents [--json] 列出全部已配置子代理
codebuddy ps / logs <pid|name> / attach / kill 管理后台 Worker 进程
codebuddy daemon start/stop/status/restart/install/uninstall 守护进程管理
# --------------------------------------------------------------------------------------常用参数
# 权限相关（重点）
- `-y` / `--dangerously-skip-permissions`：跳过权限确认。**单次模式（-p）下涉及文件读写、命令执行、网络请求时必须有明确的权限策略**，否则会被阻止
- `--permission-mode <mode>`：设置权限模式，可选 `default` / `acceptEdits` / `auto` / `dontAsk` / `plan` / `bypassPermissions`
# 会话控制
- `--continue` / `-c`：加载当前目录最近对话
- `--resume <id>`：恢复指定会话
- `--max-turns <n>`：限制非交互模式的轮次数
- `--model <模型>`：指定模型
# 输出控制
- `--output-format text|json|stream-json`：打印模式输出格式（json 适合脚本解析）
- `--input-format text|stream-json`
- `--json-schema '<schema>'`：JSON Schema 校验结构化输出
- `--verbose` / `--debug`：调试日志
# 系统提示词
- `--system-prompt "文本"`：**替换**整个默认提示词
- `--system-prompt-file ./file.txt`：从文件加载替换（仅打印模式）
- `--append-system-prompt "文本"`：**追加**到默认提示词（最推荐，保留内置功能）
# 其他
- `--add-dir <dirs...>`：添加额外工作目录
- `--tools "Bash,Read,Defer(Glob)"`：限制内置工具白名单
- `--allowedTools` / `--disallowedTools`：允许 / 禁止工具列表
- `--agent <name>` / `--agents '<json>'`：选择 / 动态定义子代理
- `--sandbox [url]`：沙箱模式运行（容器或 E2B 云端）
- `--serve --port <n>`：启动 HTTP 服务（Web UI/REST API）
- `--bg --name <name>`：后台运行会话交互模式快捷键
- `↑/↓`：历史命令；`Tab`：自动补全；`Esc`：清空输入
- `Shift+Tab`（或 `Alt+M`）：切换权限模式（default → bypass → accept → plan）
- `Ctrl+O`：查看思考详情面板
- `Ctrl+G`：外部编辑器编辑提示词
- `Ctrl+R`：展开 / 收起详细输出
- `Ctrl+C` / `Ctrl+D`：退出典型使用示例
# 交互模式（最常用）
cd /path/to/project
codebuddy
> /init # 强烈推荐：初始化项目上下文
> 帮我分析这个项目的结构
# 单次命令模式
codebuddy -p "优化这个 SQL 查询的性能"
cat error.log | codebuddy -p "分析这些错误日志"
codebuddy -p "审查 src/utils.js 的代码质量" -y # 文件操作需加 -y
# 项目级跨文件操作
codebuddy -p "将所有组件从 class 组件迁移到函数组件" -y
codebuddy -p "为 services 目录下所有文件添加单元测试" -y
# 恢复会话
codebuddy -r "abc123" "完成这个 MR"工程目录结构
# my-project/
├─ .codebuddy/ # ✅ CodeBuddy项目配置目录
│ ├─ settings.json
│ ├─ settings.local.json
│ ├─ CODEBUDDY.md
│ ├─ rules/ # 项目规则（RULE.mdc），编码规范、约束，自动加载进prompt
│ ├─ skills/ # ✅技能目录，每个skill是独立文件夹，必须有SKILL.md
│ │ ├─ xxx-xxx-xxx/
│ │ │ ├─ SKILL.md # 必填，YAML frontmatter + 技能指令
│ │ │ ├─ references/ # 参考文档，按需加载，不常驻上下文
│ │ │ ├─ scripts/ # 辅助脚本 shell/python
│ │ │ └─ assets/ # 模板片段
│ │ └─
│ ├─ agents/
│ ├─ commands/
│ ├─ hooks/ # 事件钩子，文件保存、命令执行前后触发
│ └─ mcp.json # MCP服务配置（可选）
├─
│ ├─
│ │ ├─
│ │ └─
│ └─ xxx
├─ public
├─ src
└─ Readme.md工具指令
- 从 Figma 导入设计稿：https://www.codebuddy.cn/docs/ide/User-guide/Figma
提示词
基于已导入的Figma同一页面PC端画板Page-Home-PC和移动端WAP画板Page-Home-WAP，生成一套Vue3+Tailwind CSS响应式代码，
- 使用CSS媒体查询断点：≥1200px加载PC布局，＜768px加载WAP移动端布局；
- 相同业务组件抽离为公共组件，两端差异化布局通过:where()媒体查询控制；
- 尺寸全部转为rem/vw相对单位，禁止固定px硬编码；
- 生成可直接部署的完整页面文件，附带figma.config.json配置，支持后续设计稿一键同步更新；
- 代码添加详细注释，区分PC端独有样式与移动端独有样式。
规则：Rules
技能：Skills
Skills 是模块化的、自包含的能力包，通过提供专门的知识、工作流和工具来扩展 AI Agent 的能力。
价值
- 专业工作流：针对特定领域的自动多步骤程序。
- 工具集成：处理特定文件格式或 API 的指令。
- 领域专业知识：公司特定的知识、架构和业务逻辑。
- 打包资源：用于复杂和重复任务的脚本、参考资料和资产。
# skill-name/
├─ SKILL.md (必需)
│ ├─ YAML frontmatter 元数据 (必需)
│ │ ├─ name: (必需)
│ │ ├─ description: (必需)
│ └─ Markdown 指令 (必需)
└─ Bundled Resources (可选)
├─ scripts/ - 可执行代码 (Python/Bash 等)
├─ references/ - 旨在根据需要加载到上下文中的文档
└─ assets/ - 用在输出中的文件 (模板、图标、字体等)插件：Plugins
插件让你可以通过自定义技能、代理、钩子和 MCP 服务器来扩展 CodeBuddy Code 的功能。
目录结构
# my-project/
├─ .codebuddy/
│ ├─ plugins/
│ │ ├─ _installed/
│ │ │ ├─ npm/
│ │ │ ├─ git/
│ │ │ ├─ remote/
│ │ │ └─ local/
│ └─ xxx
├─ public
├─ src
└─ Readme.mdMCP：模型上下文协议
通过MCP服务器使用外部工具和数据源，旨在解决大模型语言（LLM）与外部数据源及工具之间无缝集成的需求。它通过标准化 AI 系统与数据源的交互方式，帮助模型获取更丰富的上下文信息，从而生成更准确、更相关的响应。
钩子：Hooks
Hook（钩子）允许你在 CodeBuddy Code 的会话生命周期内插入自定义脚本或命令，实现自动化校验、环境初始化、合规检查等高级能力。
排程：Scheduling
让代理按cron计划运行，进行日常自动化，比如每日摘要和代码审查。
连接器：Connectors
将CLI连接到Telegram、Slack、Discord、Google Chat、WhatsApp等。
执行任务
执行任务是通过对话框或Cli命令行来唤起Skill。
Cline语法与实战
Cline 是一款开源的 AI 自主编码 Agent，Cline、Cursor、Claude Code、Trea相差不大，可以参考兼容。
安装配置
IDE插件
CLI
# 命令行Cline
npm i -g cline
cline --version # Cline版本号- 高频实用示例（直接复制可用）
# 1. 直接一句话让AI改代码，自动审批
cline "重构这个项目axios请求，统一封装拦截器"
# 2. 规划模式，只输出方案不执行
cline -p "梳理项目目录结构，给出分层架构方案"
# 3. 打开终端TUI交互界面
cline -i
# 4. 指定目录+指定模型运行
cline -c ./frontend -P openai -m gpt-4o "修复登录页表单校验bug"
# 5. 查看配置
cline config
# 6. 账号绑定OpenAI
cline auth openai
# 7. 诊断配置问题
cline doctor
# 8. 在Git隔离工作树安全改代码
cline --worktree "优化package.json依赖版本"- 基本语法：cline --help
# cline [选项] [命令] [提示词]
cline [options] [command] [prompt]- prompt
示例：cline '输出当前工程的名称'
prompt # 直接输入 AI 指令提示词；不传则默认进入交互执行模式，且开启工具自动审批- Options
示例：cline --version
-V, --version # 输出版本号
-p, --plan # 进入规划模式（只做方案不直接执行代码修改）
--json # 输出纯 JSON 格式日志，替代带样式的彩色文本，适合脚本解析
--auto-approve <boolean> # 全局工具自动审批开关，默认 true；false 需要手动确认每一步文件读写、命令执行
-c, --cwd <path> # 指定工作目录，AI 仅操作该路径下文件
--thinking <level> # 思考深度：none/low/medium/high/xhigh；只写--thinking默认 medium；不填则使用模型服务商默认值
--compaction <mode> # 上下文压缩策略：agentic智能压缩 / basic基础截断 / off关闭，默认 agentic（防止超长上下文超限）
-i, --tui # 打开终端交互式 TUI 界面，可视化会话操作
--id <session-id> # 通过会话 ID 恢复历史对话上下文，续跑任务
-P, --provider <id> # 指定大模型服务商，默认 cline
-k, --key <api-key> # 临时覆盖本次运行的 API Key（仅当前命令生效）
-m, --model <model-id> # 指定本次使用的模型名称 / ID
-s, --system <system-prompt> # 自定义系统提示词，覆盖默认 AI 角色设定
-z, --zen # 后台 Hub 守护进程模式运行会话
--retries [value] # 连续出错最大重试次数，默认 6 次，超过自动退出
-t, --timeout <seconds> # 会话超时秒数，0 为不限制（默认）
--acp # ACP 协议模式，给 VS Code 等编辑器插件对接用
--config <path> # 配置文件目录，默认 ~/.cline/data/settings
--data-dir <path> # 独立数据存储目录（会话记录、缓存等），默认 ~/.cline
--hooks-dir <path> # 运行时钩子脚本目录，默认 ~/.cline/hooks
--worktree # 自动在~/.cline/worktrees/创建 Git 独立工作区，在隔离副本中执行代码修改，不污染原仓库
--update # 检测并自动升级 Cline CLI
--kanban # 启动内置看板应用
-v, --verbose # 开启详细日志输出，排错用
-h, --help # 查看帮助- Commands
示例：cline config
auth [options] [provider] # 服务商账号认证，配置对应模型与密钥，最常用初始化命令
config [options] # 查看当前所有生效配置（模型、key、路径、策略等）
plugin # Cline 插件管理：安装、卸载、列表、启用禁用插件
skill [args...] # 技能管理，底层调用 npx skills 官方技能 CLI
connect [options] [channel] # 对接外部消息渠道（如 IM、Webhook 等）
mcp # MCP 服务管理（Model Context Protocol，上下文服务），挂载本地工具、文件服务等
doctor # 配置诊断修复工具：自动检测权限、路径、API 连通性、依赖缺失并修复问题
history|h [options] # 会话历史管理：查看历史记录、删除会话、导出上下文、按 ID 恢复
hook # 从标准输入读取载荷执行钩子脚本，多用于 CI/Git 钩子联动
schedule # 定时任务管理：创建 / 删除 / 查看定时执行的 AI 任务
hub # 本地后台守护进程（Hub）启停、状态管理
dashboard [options] # 启动 Cline 后台面板，自动打开浏览器可视化管理
update [options] # 等同于全局--update，升级 CLI 工具
version # 单独输出版本号
kanban # 启动项目看板应用（和全局 --kanban 一致）工具指令
规则目录
your-project/
├─ .clinerules/ # Workspace rules
│ ├─ coding.md # Coding standards
│ ├─ testing.md # Test requirements
│ └─ architecture.md # Structural decisions
├─ src/
└─ ....agentignore
# 构建、依赖包目录
**/node_modules/
**/vendor/
**/.venv/
**/__pycache__/
node_modules/
dist/
build/
.output/
.nuxt/
# 构建产物、打包输出
**/dist/
**/build/
**/.next/
**/out/
*.min.js
*.bundle.*
# 环境敏感文件
.env
.env.*
.env.production
.env.development
!.env.example
# IDE、版本控制缓存
.git/
.vscode/
.idea/
.DS_Store
*.log
*.local
# 锁文件（体积大且无需阅读）
pnpm-lock.yaml
package-lock.json
yarn.lock
# 测试覆盖率、临时文件
coverage/
tmp/
temp/
*.tmp
# 白名单例外（保留指定文件）
!important-config.json
!src/config/index.ts
# 版本控制
.git/
.svn/
# 静态资源
public/
assets/
*.png
*.jpg
*.jpeg
*.svg
*.ico规则：Rules
具体的指令和编码标准，提供贯穿所有对话的持久指令。
WARNING
规则消耗上下文标记。避免冗长的解释或粘贴整份风格指南。保持规则简洁，并在需要详细参考时链接外部文档。
- 工作区规则放在你的项目根节点。这些内容可用于团队标准、项目特定约束，以及你想通过版本控制与协作者共享的任何内容。
- 全局规则会放在你系统的Cline规则目录里。这些内容适用于适用于所有项目的个人偏好。
- 当工作区和全局规则同时存在时，会将两者合并。
- 当工作区规则与全局规则冲突时，全局规则会优先。
最简示例
- .cline/rules/Readme.md
# 内容说明
- 新创建的文件，都在文件底部新增日期的注释- 触发行为
内容范围
- 遵循团队的编码标准（命名规范、文件组织、错误处理模式）
- 理解项目特定的背景（技术栈、架构决策、依赖关系）
- 应用一致的文档或测试要求
- 记住诸如“不要修改 /legacy 文件”或“始终使用 TypeScript” 这样的约束。
# Rule Title
Brief context about why this rule exists (optional but helpful).
## Category 1
- Specific instruction
- Another instruction with example: `like this`
- Reference to file: see /src/utils/example.ts
## Category 2
- More instructions
- Include the "why" when it's not obvious目录结构
my-project/
├─ .cline
│ ├─
│ │ └─
├─ .clinerules
│ ├─ api-endpoints.md # Rules for API code
│ ├─ database-models.md # Rules for DB layer
│ ├─ react-components.md # Rules for React
│ ├─ coding.md
│ ├─ testing.md
│ ├─ architecture.md
│ └─ universal.md # No frontmatter = always active
├─ public
├─ src
└─ Readme.md最佳实践
- 具体详细：例如，变量用 camelCase，类用 PascalCase，常数用 UPPER_SNAKE。
- 写上原因：当规则看起来很随意时，解释原因。“请勿修改 /legacy 中的文件（该代码计划在第二季度删除）”帮助在极端情况下做出更好的决策。
- 枚举案例：如果你的代码库已经展示了你想要的模式，就引用它。“遵循 /src/utils/errors.ts 中的错误处理模式”比从零描述模式更有效。
- 保持最新：过时的规则会浪费上下文。如果某个约束不再适用，就移除它。如果你的技术栈发生变化，更新规则。
- 专事专注：每个档案只需一个问题，按主题划分规则：风格、测试要求、结构决策。
条件规则
条件规则允许你将规则范围限定到代码库的具体部分。规则只有在你处理匹配文件时才会激活，保持上下文的聚焦和相关性。
- 没有条件句：每个规则都会为每个请求加载。
- 使用条件语时，只有当当前文件符合其定义范围时，规则才会激活。
---
paths:
- "src/components/**"
- "src/hooks/**"
---
# React Component Guidelines
When creating or modifying React components:
- Use functional components with React hooks
- Extract reusable logic into custom React hooks
- Keep components focused on a single responsibility条件句paths
---
paths:
- "src/**" # All files under src/
- "*.config.js" # Config files in root
- "packages/*/src/" # Monorepo package sources
---Glob模式语法
- *匹配任何字符，除了/
- **匹配包括（递归）在内的任何字符/
- ?匹配单个字符
- [abc]匹配括号内的任何字符
- {a,b}与任一模式匹配
-------------------------------------------------------
模式 比赛
-------------------------------------------------------
src/**/*.ts 所有 TypeScript 文件src/
*.md 仅 root 的 markdown 文件
**/*.test.ts 项目中任意的测试文件
packages/{web,api}/** 网页或API包中的文件
src/components/*.tsx TSX文件直接出现在组件中（非嵌套）
-------------------------------------------------------多重模式
---
paths:
- "frontend/**"
- "mobile/**"
---
# Activates when working in frontend OR mobile前端与后端规则
# .clinerules/frontend.md
---
paths:
- "src/components/**"
- "src/pages/**"
- "src/hooks/**"
---
# Frontend Guidelines
- Use Tailwind CSS for styling
- Prefer server components where possible
- Keep client components small and focused
# .clinerules/backend.md
---
paths:
- "src/api/**"
- "src/services/**"
- "src/db/**"
---
# Backend Guidelines
- Use dependency injection for services
- All database queries go through repositories
- Return typed errors, not thrown exceptions测试文件规则
# .clinerules/testing.md
---
paths:
- "**/*.test.ts"
- "**/*.spec.ts"
- "**/__tests__/**"
---
# Testing Standards
- Use descriptive test names: "should [expected behavior] when [condition]"
- One assertion per test when possible
- Mock external dependencies, not internal modules
- Use factories for test data, not fixtures文档规则
# .clinerules/docs.md
---
paths:
- "docs/**"
- "**/*.md"
- "**/*.mdx"
---
# Documentation Guidelines
- Use sentence case for headings
- Include code examples for all features
- Keep paragraphs short (3-4 sentences max)
- Link to related documentation技能：Skills
技能是模块化指令集，用于实现在特定任务上的能力，每个技能打包了详细的指导、流程和可选资源，仅在相关请求时按需加载，不消耗无关上下文。
- 当全局技能和项目技能名称相同时，全局技能优先。这样你可以全局保留通用技能，同时使用项目专属技能，让整个团队都能使用。
- 技能将一个通用助理转变为了解你领域的专家。先用一个技能来做一个你经常重复的任务，测试它，并不断修改描述，直到它能稳定触发。
目录结构
# my-project/
├─ .cline
│ ├─ skills
│ │ ├─ skill-name
│ │ │ ├─ SKILL.md # 必需：主指令文件（含 YAML frontmatter）
│ │ │ ├─ docs/ # 使用文档来获取过于详细无法 SKILL.md 或只在特定情况下相关的信息
│ │ │ │ └─ advanced.md
│ │ │ ├─ templates/ # 当你的技能创建配置文件、样板代码或结构化文档时，可以使用模板
│ │ │ │ └─ config.yaml
│ │ │ └─ scripts/ # 在确定性操作中使用脚本，要求行为一致
│ │ │ │ └─ helper.sh
│ └─ xxx
├─ public
├─ src
└─ Readme.md内容结构
- name：必须与目录名称完全一致
- description：描述决定了克莱恩何时激活该技能。（最多1024字符）
---
name: skill-name
description: Brief description of what this skill does and when to use it.
---
# My Skill
Detailed instructions for Cline to follow when this skill is activated.
## Steps
1. First, do this
2. Then do that
3. For advanced usage, see [advanced.md](docs/advanced.md)文档：docs/
使用文档来获取过于详细无法 SKILL.md 或只在特定情况下相关的信息
- 高级配置选项
- 边缘情况的故障排除指南
- 参考材料（API 模式、数据库模式）
- 平台专用指令
模板：templates/
当你的技能创建配置文件、样板代码或结构化文档时，可以使用模板
- 配置文件（Terraform、Docker Compose、CI/CD pipelines）
- 代码支架（组件模板、测试夹具）
- 文档模板（README，API 文档）
脚本：scripts/
在确定性操作中使用脚本，要求行为一致
- 验证（对配置进行线条处理，检查前提条件）
- 数据处理（解析、格式化、转换）
- 复杂计算（成本估算、资源规模）
- API 交互（获取数据，运行健康检查）
在 SKILL.md 说明中参考这些文件
初始配置请参考 [setup.md](docs/setup.md).
以 `templates/config.yaml` 内的配置模板作为基础文件。
执行校验脚本检查配置文件:
python scripts/validate.py产研工作链路AI提效
最大影响：思维升级与能力跃迁
需求分析、理解、拆分与细化
问题分析、排查与定位
整体代码规范自动对齐
功能模块的业务开发
代码质量审查
单元测试
改造：历史项目的架构设计
改造：历史项目的性能优化
改造：历史项目的代码结构
CI/CD集成自动化
提示词：Prompt
参考模板
【角色定义】你是资深前端开发工程师，精通Vue3 + TypeScript + Pinia + Element Plus，严格遵循我司前端代码规范。
【任务目标】根据业务需求，生成符合规范的Vue3单文件组件代码。
【输入信息】
- 组件功能：{描述组件的核心功能与业务场景}
- 入参Props：{列出组件的入参名称、类型、是否必填、默认值}
- 对外事件：{列出组件触发的事件名称与回调参数}
- 依赖接口：{描述组件依赖的后端接口字段结构}
【输出要求】
1. 使用 <script setup lang="ts"> 语法，Composition API 写法
2. Props与Emits必须使用TypeScript类型定义，禁止any类型
3. 样式使用Scoped CSS，类名采用BEM命名规范
4. 包含完整的错误处理、加载状态、空状态处理
5. 代码注释清晰，关键逻辑添加行内注释
6. 附带组件的使用示例代码
【约束条件】
1. 严格遵循《前端代码风格规范V2.0》
2. 禁止引入额外的第三方依赖
3. 遵循OWASP前端安全规范，做好XSS防护，禁止使用v-html渲染用户输入内容
4. 响应式数据命名符合团队规范，状态管理使用Pinia
【参考规范】缩进2空格，单引号，无分号，文件命名采用kebab-caseVibe Coding 开发任务：
目标：快速实现可用Demo，优先实现功能，后续再重构。
约束：
- 代码结构尽量清晰，避免无意义冗余；
- 标出潜在缺陷与安全提醒；
- 所有文件分离，给出项目目录；
- 告诉我如何安装依赖、启动项目；
- 改动请说明变更点。
规则：
1. 直接输出完整代码，不要过度理论讲解；
2. 优先保证代码能直接运行，注释简洁；
3. 如果出现报错，我粘贴错误信息，你自主修复；
4. UI优先美观、现代简约风格；
5. 提供启动/运行步骤。
禁止：生成需要额外本地环境才能运行的代码。
需求：【填入需求】前端工程：fitness_admin_fe
fitness_admin_fe是一个基于 Vue3、Vite 的前端工程。
规则
- index.md
# 工程目录结构
├─ .vscode/ # VS Code 编辑器配置
│ ├─ settings.json # 编辑器统一配置（缩进、格式化规则、文件关联、保存自动修复 ESLint 等）
│ └─ extensions.json # 推荐插件列表
├─ .cline/ # AI 编码助手 Cline 的项目配置目录，存放对话记录、规则文件、上下文缓存，纯开发辅助文件
├─ dist/
├─ env/ # 环境变量配置
│ ├─ .env
│ ├─ .env.build
│ └─ .env.serve
├─ packages/ # Monorepo 多包管理目录
├─ public/ # 静态资源，不参与构建打包
├─ node_modules/
├─ src/ # 源码核心目录（最重要）
│ ├─ api/ # 接口请求层，统一封装axios，按模块拆分后端请求（用户、会员、课程、器械、订单等健身业务接口）
│ ├─ config/ # 项目全局配置，路由守卫配置、全局请求拦截器配置、全局开关、第三方SDK初始化配置
│ ├─ assets/ # 编译型静态资源，图片、字体、全局scss/less样式、主题变量、图标文件（会被vite打包压缩）
│ ├─ utils/ # 工具函数库（重复工具类），日期处理、金额格式化、文件导出、防抖节流、权限判断、加密解密等通用方法
│ └─ core/ # 项目内核层（底层封装），全局请求核心封装、全局错误捕获、全局挂载逻辑、应用启动核心流程
│ ├─ docs/ # 项目内部文档
│ ├─ test/ # 单元/集成测试目录
│ ├─ plugins/ # Vue插件注册
│ ├─ constants/ # 全局常量枚举
│ ├─ stores/ # 状态管理（Pinia/Vuex）
│ ├─ declare/ # TS类型声明文件，全局类型定义、模块补充声明、第三方库缺失类型、接口返回数据TS接口定义
│ ├─ components/ # 全局公共通用组件
│ ├─ common/ # 公共混入、全局指令、全局过滤器、全局挂载方法
│ ├─ views/ # 业务页面视图（页面主体）
│ ├─ helpers/ # 业务辅助函数（区别于通用utils），如课时计算、有效期换算、费用分摊规则等业务专属方法
│ ├─ widgets/ # 业务级复杂封装组件，区别于基础components，例如会员选择器、课程排课日历、消费记录卡片、统计大屏模块等
│ ├─ router/ # 路由管理
│ ├─ App.vue # 根组件，全局路由容器、全局样式注入、全局监听
│ └─ main.js # 项目入口文件，Vue实例创建、插件注册、全局挂载、路由/状态挂载
├─ Makefile # 命令快捷脚本，封装 build、lint、deploy、clean 等命令，简化终端操作
├─ .eslintrc.cjs # ESLint 代码规范校验规则，约束 JS/TS/Vue 代码格式，统一团队编码风格
├─ .agentignore # AI 工具忽略文件，类似.gitignore，配置 AI 不读取 / 不修改的文件
├─ index.html # Vite 入口 HTML 模板，挂载根节点、引入全局 CDN、配置环境变量占位
├─ vite.config.ts # Vite 构建配置，别名、打包规则、代理、插件、路径解析、构建优化
├─ package.json # 项目依赖、脚本命令、项目描述、版本、eslint 配置、构建指令
└─ Readme.md # 项目说明文档，启动步骤、环境要求、目录说明、打包部署、开发规范Shopify独立站：US-FED-Fitness
规则
- index.md
# 生态技术栈
- Shopify Theme版本：Refresh 15.3.0
# Shopify工程：US-FED-Fitness
- 支持 30+ 种语言本地化
- 包含 Feier、Yosuda、Flybird、BCAN 等多品牌专属区块
- 大量自定义 module- 组件（轮播、标签、瀑布流等）
- 丰富的产品模板，针对不同产品线（哑铃、跑步机、划船机等）定制化
# 工程目录结构
├─ assets/ # 静态资源 (约300+文件)
│ ├─ *.css # 样式文件（组件、页面、布局）
│ ├─ *.js # 脚本文件（购物车、产品、搜索等）
│ ├─ *.svg / *.png / *.webp # 图标与图片资源
│ └─ *.json # 配置文件（tapita SEO等）
│
├─ blocks/ # AI 生成区块 (16个)
│ └─ ai_gen_block_*.liquid
│
├─ config/ # 主题配置
│ ├─ settings_data.json
│ └─ settings_schema.json
│
├─ layout/ # 布局模板
│ ├─ theme.liquid
│ └─ password.liquid
│
├─ locales/ # 多语言支持 (30+语言)
│ ├─ en.default.json
│ ├─ zh-CN.json
│ ├─ zh-TW.json
│ └─ ...（含 de/fr/ja/ko/es 等）
│
├─ sections/ # 页面区块 (约250+文件)
│ ├─ header.liquid / footer.liquid
│ ├─ main-product.liquid
│ ├─ main-collection-product-grid.liquid
│ ├─ featured-collection.liquid
│ ├─ module-*.liquid # 自定义模块组件
│ ├─ own-*.liquid # 品牌专属区块
│ ├─ v-*.liquid / v*.liquid # V系列组件
│ ├─ feier-*.liquid # Feier品牌区块
│ ├─ yosuda-*.liquid # Yosuda品牌区块
│ └─ ...
│
├─ snippets/ # 可复用代码片段 (约150+文件)
│ ├─ card-product.liquid
│ ├─ product-media-gallery.liquid
│ ├─ header-mega-menu.liquid
│ ├─ cart-drawer.liquid
│ ├─ facets.liquid
│ └─ ...
│
├─ templates/ # 页面模板
│ ├─ index.json # 首页
│ ├─ product.json / product.*.json # 产品页（80+个）
│ ├─ collection.json / collection.*.json # 集合页（30+个）
│ ├─ page.json / page.*.json # 自定义页面（50+个）
│ ├─ blog.json / article.json
│ ├─ cart.json / search.json
│ ├─ 404.json / password.json
│ ├─ robots.txt.liquid
│ ├─ llms.txt.liquid
│ ├─ gift_card.liquid
│ ├─ customers/ # 客户账户页面
│ │ ├─ account.json
│ │ ├─ login.json
│ │ ├─ register.json
│ │ ├─ order.json
│ │ └─ ...
│ └─ metaobject/ # 元对象模板（产品资源页）
│ ├─ resources.json
│ └─ resources.*.json（40+个产品资源页）
│
└─ temp/ # 临时文件
└─ blocks/414086529313/unconfirmed/
└─ ai_gen_block_08f2efb.liquid