@ia-ccun/code-agent-cli 0.0.49 → 0.0.50-beta.2

package/README.md

@@ -217,22 +217,48 @@ aicode-cli --list-models   # 列出可用模型
 
 ### 创建自定义 Skill
 
-在 `~/.aicode-cli/skills/` 目录下创建 `.md` 文件：
+在 `~/.aicode-cli/agent/skills/<skill-name>/` 目录下创建 `SKILL.md` 文件：
+
+```bash
+# 创建技能目录
+mkdir -p ~/.aicode-cli/agent/skills/my-skill
+
+# 创建 SKILL.md
+cat > ~/.aicode-cli/agent/skills/my-skill/SKILL.md << 'EOF'
+---
+name: my-skill
+description: "技能的简短描述。Use when 触发条件描述。"
+metadata:
+  version: "1.0.0"
+  author: "your-name"
+---
 
-```markdown
 # My Skill
 
 ## 描述
-技能说明
+技能的详细说明
 
 ## 触发方式
-/skill:my-skill
+`/skill:my-skill`
 
 ## 执行步骤
 1. 步骤一
 2. 步骤二
+EOF
 ```
 
+**字段说明：**
+
+| 字段 | 必填 | 说明 |
+|------|------|------|
+| `name` | 是 | 技能标识符（小写+连字符），与目录名一致 |
+| `description` | 是 | 触发条件描述，Agent 据此判断何时使用该技能 |
+| `disable-model-invocation` | 否 | 设为 `true` 时禁止调用 LLM，纯本地执行 |
+| `metadata.version` | 否 | 版本号 |
+| `metadata.author` | 否 | 作者 |
+
+> ⚠️ 文件名必须为 `SKILL.md`，且放在独立目录中（目录名与 `name` 一致）。
+
 ## 预置 Prompts
 
 内置 Prompt 模板位于 `config/agent/prompts/`（打包在 npm 包中）

package/bin/cli.js

@@ -194,7 +194,8 @@ async function checkForUpdates() {
 checkForUpdates();
 
 // 获取 node_modules 中 pi-coding-agent 的 CLI 路径
-const piAgentPath = new URL('../node_modules/@mariozechner/pi-coding-agent/dist/cli.js', import.meta.url);
+const piAgentPathUrl = new URL('../node_modules/@mariozechner/pi-coding-agent/dist/cli.js', import.meta.url);
+const piAgentPath = fileURLToPath(piAgentPathUrl); // 解码中文路径
 
 // 获取本地版本号
 const localVersion = getLocalVersion();
@@ -221,7 +222,7 @@ const agentDir = join(fullPath, 'agent');
 env.AICODE_CLI_CODING_AGENT_DIR = agentDir;
 
 // 启动 pi-coding-agent
-const child = spawn('node', [piAgentPath.pathname, ...remainingArgs], {
+const child = spawn('node', [piAgentPath, ...remainingArgs], {
   stdio: 'inherit',
   env
 });

package/config/agent/extensions/aicode-tips.ts

@@ -2,7 +2,7 @@
  * @author: xujianjiang
  * Aicode Tips Extension — 在边框下方、状态栏上方随机显示使用技巧
  *
- * 显示 10 秒后消失，3 秒后显示下一条
+ * 每 10 秒轮播显示下一条技巧
  * 技巧列表包含快捷键、命令使用及联系方式提示
  */
 
@@ -16,26 +16,25 @@ const AICODE_TIPS = [
   "Ctrl+O 展开/折叠工具输出",
   "Ctrl+T 展开/折叠思考块",
   "Alt+Enter 队列跟进消息",
-  "Ctrl+V 粘贴图片",
   "Shift+Enter 输入多行",
   "/ 查看所有命令",
   "/tree 查看会话历史",
   "/session 查看统计",
   "/settings 自定义设置",
-  "/export 导出会话为HTML",
+  "/export 导出会话为 HTML",
   "/copy 复制最后消息",
   "/name 设置会话名称",
   "/hotkeys 显示所有快捷键",
   "/reload 重新加载配置文件",
   "/new 开始新会话",
   "!cmd 执行 bash",
-  "!!cmd 执行bash但不发送给AI",
+  "!!cmd 执行 bash 但不发送给 AI",
   "/compact 压缩上下文",
-  "/skill:name 调用技能",
+  "/skill:技能名称  调用技能",
   "/resume 恢复会话",
-  "/fork 创建新分支",
+  "/fork 创建会话新分支",
   "Ctrl+C 清空编辑器",
-  "双击Esc 打开树视图",
+  "双击 Esc 打开树视图",
   "拖拽文件到终端附加",
   // 扩展命令提示
   "/version 查看当前版本",
@@ -43,32 +42,32 @@ const AICODE_TIPS = [
   "/status 显示会话状态",
   "/clear 清理当前会话",
   "/quit 退出当前会话",
-  // 常用Prompt提示
+  // 常用 Prompt 提示
   "/code-simplifier 自动简化刚修改的代码，提升清晰度和一致性",
   "/feat 新功能开发，支持需求规划→讨论迭代→执行实施完整流程（推荐使用）",
-  "/git-commit 分析Git改动并生成Conventional Commits规范提交信息（推荐使用）",
-  "/init-project 初始化项目AI上下文，生成根级和模块级CLAUDE.md索引",
-  "/workflow 专业开发者6阶段结构化工作流（研究→构思→计划→执行→优化→评审）",
+  "/git-commit 分析 Git 改动并生成 Conventional Commits 规范提交信息（推荐使用）",
+  "/init-project 初始化项目 AI 上下文，生成根级和模块级 CLAUDE.md 索引",
+  "/workflow 专业开发者 6 阶段结构化工作流（研究→构思→计划→执行→优化→评审）",
   // 常用技能提示
   "/skill:brainstorming 探索用户意图、需求分析和方案设计",
   "/skill:code-review 执行全面的代码质量/安全/性能审查（推荐使用）",
-  "/skill:commit 分析代码变更并生成规范的Git提交信息",
+  "/skill:commit 分析代码变更并生成规范的 Git 提交信息",
   "/skill:frontend-design 创建高质量生产级前端界面（推荐使用）",
-  "/skill:owasp-security 遵循OWASP Top 10的安全编码实践（推荐使用）",
+  "/skill:owasp-security 遵循 OWASP Top 10 的安全编码实践（推荐使用）",
   "/skill:receiving-code-review 技术性处理代码评审反馈并验证（推荐使用）",
   "/skill:requesting-code-review 请求代码评审确保满足合并要求",
   "/skill:unit-test 为选定的代码文件生成单元测试",
   "/skill:verification-before-completion 完成前验证实际工作是否完整",
   "/skill:writing-plans 为多步骤任务编写详细的实施计划（推荐使用）",
-  "/skill:writing-skills 创建、修改和优化Agent技能并测量性能", 
+  "/skill:writing-skills 创建、修改和优化 Agent 技能并测量性能",
   "/skill:session-learning 总结会话经验并沉淀为可复用的技能",
-  "/skill:test-driven-development 先写测试再写实现的TDD开发模式",
-  "/skill:subagent-driven-development 通过派发子Agent执行复杂实施计划",
+  "/skill:test-driven-development 先写测试再写实现的 TDD 开发模式",
+  "/skill:subagent-driven-development 通过派发子 Agent 执行复杂实施计划",
   "/skill:dispatching-parallel-agents 并行分发多个独立任务无共享状态",
-  "/skill:csv-data-summarizer 分析CSV文件并生成统计和可视化图表",
+  "/skill:csv-data-summarizer 分析 CSV 文件并生成统计和可视化图表",
   "/skill:executing-plans 执行带有检查点的书面实施计划",
-  "/skill:frontend-slides 使用HTML/CSS创建精美的演示幻灯片",
-  "/skill:markdown-to-html 将Markdown文档转换为精美的HTML页面",
+  "/skill:frontend-slides 使用 HTML/CSS 创建精美的演示幻灯片",
+  "/skill:markdown-to-html 将 Markdown 文档转换为精美的 HTML 页面",
   "/skill:refactor 重构代码提升可读性和可维护性保持功能不变",
   "/skill:skill-creator 创建、修改和提升技能性能的工具",
   "/skill:adapt (impeccable) 使设计适配不同的屏幕尺寸、设备、场景或平台，确保跨环境体验一致",
@@ -90,22 +89,22 @@ const AICODE_TIPS = [
   "/skill:polish (impeccable) 上线前的最终质量检查，修正对齐、间距、一致性和细节问题",
   "/skill:quieter (impeccable) 弱化过于大胆或视觉攻击性强的设计，降低视觉强度",
   "/skill:typeset (impeccable) 通过修正字体选择、层级、大小、粗细来优化排版",
-  "/skill:ui-ux-pro-max 提供50种设计风格和21种配色方案的设计助手（推荐使用）",
+  "/skill:ui-ux-pro-max 提供 50 种设计风格和 21 种配色方案的设计助手（推荐使用）",
   // 常用技能提示
   "/btw 并行侧边对话，可在不中断主流程的情况下进行临时讨论或查询 ",
   "/rewind 回退到任意工具执行前的状态，支持快照恢复和撤销重做 ",
-  "/mcp 连接现有的MCP服务器(如xx平台、企业微信等等)，扩展AI能力支持多种外部工具和服务 ",
+  "/mcp 连接现有的 MCP 服务器 (如 xx 平台、企业微信等等)，扩展 AI 能力支持多种外部工具和服务 ",
   // 消息传递模式提示
-  "Enter 插话消息 - 在工具执行后立即发送，中断AI思考流程",
-  "Alt+Enter 排队消息 - 等待AI完全结束后发送，不中断AI工作",
-  "Escape 中断当前AI并恢复编辑器中的排队消息",
+  "Enter 插话消息 - 在工具执行后立即发送，中断 AI 思考流程",
+  "Alt+Enter 排队消息 - 等待 AI 完全结束后发送，不中断 AI 工作",
+  "Escape 中断当前 AI 并恢复编辑器中的排队消息",
   "Alt+Up 查看并编辑所有排队的消息",
-  "插话消息会打断AI正在执行的工具，等待响应",
-  "排队消息静默等待，AI空闲时自动发送",
+  "插话消息会打断 AI 正在执行的工具，等待响应",
+  "排队消息静默等待，AI 空闲时自动发送",
   "可在 /settings 中调整消息发送模式和行为偏好",
   // 联系方式提示
   "⚠️  任何疑问或需求可联系 xujianjiang，支持需求对接开发、系统集成与扩展",
-  "⚠️  内网手册参考 UniDoc《2026.03 AICode Agent CLI编码智能体使用手册》",
+  "⚠️  内网手册参考 UniDoc《2026.03 AICode Agent CLI 编码智能体使用手册》",
   "⚠️  LLM API 4xx/5xx 错误时请确认模型配置是否正确，或在企微群咨询 jiangchi、maliang",
 ];
 
@@ -150,11 +149,13 @@ export default function (pi: ExtensionAPI) {
     return str + " ".repeat(padding);
   };
 
-  const showRandomTip = () => {
+  const showRandomTip = (isInternalCall = false) => {
     if (!currentCtx?.hasUI) return;
 
-    // 清除之前的定时器
-    clearAllTimers();
+    // 清除之前的定时器（但内部轮播调用时不清除，避免中断轮播）
+    if (!isInternalCall) {
+      clearAllTimers();
+    }
 
     let randomIndex = Math.floor(Math.random() * AICODE_TIPS.length);
     if (randomIndex === currentTipIndex && AICODE_TIPS.length > 1) {
@@ -167,12 +168,9 @@ export default function (pi: ExtensionAPI) {
     const coloredTip = `${color}tips: ${tip}\x1b[0m`;
     currentCtx.ui.setWidget("aicode-tips", [coloredTip], { placement: "aboveEditor" });
 
-    // 自动轮播：10秒后隐藏，隐藏后3秒显示下一条
+    // 自动轮播：10 秒后直接显示下一条
     if (isAutoPlaying) {
-      autoHideTimeoutId = setTimeout(() => {
-        hideTip();
-        autoShowTimeoutId = setTimeout(showRandomTip, 3000);
-      }, 10000);
+      autoHideTimeoutId = setTimeout(() => showRandomTip(true), 10000);
     }
   };
 
@@ -207,4 +205,4 @@ export default function (pi: ExtensionAPI) {
       showRandomTip();
     },
   });
-}
+}

package/config/agent/extensions/error-monitor.ts

@@ -3,15 +3,16 @@
  *
  * @author: xujianjiang
  *
- * Logs errors to ./.aicode-cli/debug-logs/aicode-error-YYYY-MM-DD.log
+ * Logs errors to ~/.aicode-cli/logs/aicode-error-YYYY-MM-DD.log
  */
 
 import type { ExtensionAPI } from "@mariozechner/pi-coding-agent";
 import fs from "fs";
+import os from "os";
 import path from "path";
 
 // Error log file configuration
-const ERROR_LOG_DIR = path.resolve(process.cwd(), "./.aicode-cli/debug-logs");
+const ERROR_LOG_DIR = path.resolve(os.homedir(), ".aicode-cli", "logs");
 const KEEP_DAYS = 2; // 保留最近2天
 
 // 北京时间格式化函数 (UTC+8)

package/config/agent/help.md

@@ -31,6 +31,8 @@ npm install -g @ia-ccun/code-agent-cli
 
 ```bash
 aicode-cli
+# 或
+aicode
 ```
 
 ### 基本对话
@@ -66,6 +68,15 @@ Ctrl+Q
 Enter
 ```
 
+### Git Worktree 支持
+
+使用 `/skill:using-git-worktrees` 在多工作区间高效切换：
+
+```
+/skill:using-git-worktrees
+帮我创建一个新的 worktree 来开发登录功能
+```
+
 ---
 
 ## 3. 核心命令
@@ -90,6 +101,13 @@ Enter
 
 思考级别：`off` → `minimal` → `low` → `medium` → `high` → `xhigh`
 
+### 技能相关
+
+| 命令 | 说明 |
+|------|------|
+| `/skill:<name>` | 激活指定技能 |
+| `/skills` | 列出所有可用技能 |
+
 ---
 
 ## 4. 快捷键
@@ -224,16 +242,71 @@ Skill 是预置的 AI 技能模块，针对特定场景优化。
 
 ### 可用 Skills
 
+#### 代码开发
+
 | Skill | 说明 | 激活方式 |
 |-------|------|----------|
-| code-review | 代码审查 | `/skill:code-review` |
-| commit | Git 提交 | `/skill:commit` |
-| pr | PR 描述 | `/skill:pr` |
-| refactor | 代码重构 | `/skill:refactor` |
-| unit-test | 单元测试 | `/skill:unit-test` |
-| csv-data-summarizer | CSV 数据分析 | `/skill:csv-data-summarizer` |
-| frontend-design | 前端设计 | `/skill:frontend-design` |
-| ui-ux-pro-max | UI/UX 设计 | `/skill:ui-ux-pro-max` |
+| `code-review` | 代码审查 | `/skill:code-review` |
+| `refactor` | 代码重构 | `/skill:refactor` |
+| `unit-test` | 单元测试 | `/skill:unit-test` |
+| `test-driven-development` | 测试驱动开发 | `/skill:test-driven-development` |
+| `frontend-design` | 前端设计 | `/skill:frontend-design` |
+| `owasp-security` | OWASP 安全编码 | `/skill:owasp-security` |
+
+#### Git 相关
+
+| Skill | 说明 | 激活方式 |
+|-------|------|----------|
+| `commit` | Git 提交消息生成 | `/skill:commit` |
+| `using-git-worktrees` | Git Worktree 管理 | `/skill:using-git-worktrees` |
+
+#### 数据分析
+
+| Skill | 说明 | 激活方式 |
+|-------|------|----------|
+| `csv-data-summarizer` | CSV 数据分析 | `/skill:csv-data-summarizer` |
+| `design-md` | Markdown 设计文档 | `/skill:design-md` |
+
+#### UI/UX 设计
+
+| Skill | 说明 | 激活方式 |
+|-------|------|----------|
+| `ui-ux-pro-max` | UI/UX 专业设计 | `/skill:ui-ux-pro-max` |
+| `impeccable/*` | 完美界面系列技能 | `/skill:impeccable:polish` 等 |
+
+#### 多媒体
+
+| Skill | 说明 | 激活方式 |
+|-------|------|----------|
+| `video-generation` | 视频生成 | `/skill:video-generation` |
+| `aliyun-tts` | 阿里云 TTS | `/skill:aliyun-tts` |
+| `xiaomi-tts` | 小米 TTS | `/skill:xiaomi-tts` |
+
+#### 写作与内容
+
+| Skill | 说明 | 激活方式 |
+|-------|------|----------|
+| `khazix-writer` | 公众号长文写作 | `/skill:khazix-writer` |
+| `hv-analysis` | 横纵分析法深度研究 | `/skill:hv-analysis` |
+
+#### 开发流程
+
+| Skill | 说明 | 激活方式 |
+|-------|------|----------|
+| `brainstorming` | 头脑风暴 | `/skill:brainstorming` |
+| `writing-plans` | 编写实施计划 | `/skill:writing-plans` |
+| `executing-plans` | 执行计划 | `/skill:executing-plans` |
+| `dispatching-parallel-agents` | 并行任务分发 | `/skill:dispatching-parallel-agents` |
+| `systematic-debugning` | 系统性调试 | `/skill:systematic-debugging` |
+| `verification-before-completion` | 完成前验证 | `/skill:verification-before-completion` |
+
+#### 技能管理
+
+| Skill | 说明 | 激活方式 |
+|-------|------|----------|
+| `skill-creator` | 创建/编辑技能 | `/skill:skill-creator` |
+| `session-learning` | 会话学习总结 | `/skill:session-learning` |
+| `find-skills` | 查找技能 | `/skill:find-skills` |
 
 ### 使用方法
 
@@ -254,13 +327,11 @@ Prompt 是预置的工作流模板，用于特定任务。
 
 | Prompt | 说明 |
 |--------|------|
-| `/bmad-init` | 初始化 BMAD 项目 |
 | `/init-project` | 初始化新项目 |
 | `/feat` | 新增功能开发流程 |
 | `/git-commit` | Git 提交 |
-| `/git-rollback` | Git 回滚 |
-| `/git-worktree` | Git Worktree 管理 |
 | `/workflow` | 复杂工作流 |
+| `/code-simplifier` | 代码简化 |
 
 ### 使用示例
 
@@ -273,6 +344,9 @@ Prompt 是预置的工作流模板，用于特定任务。
 
 # Git 提交
 /git-commit
+
+# 复杂工作流
+/workflow
 ```
 
 ---
@@ -293,9 +367,11 @@ Prompt 是预置的工作流模板，用于特定任务。
 
 | 主题 | 说明 |
 |------|------|
-| dark | 暗色主题 |
-| light | 亮色主题 |
-| catppuccin-mocha | 猫puccin mocha（推荐） |
+| `catppuccin-mocha` | Catppuccin Mocha 暗色主题（推荐） |
+
+### 自定义主题
+
+主题文件位于 `~/.aicode-cli/agent/themes/`，可自定义颜色和样式。
 
 ---
 
@@ -320,6 +396,12 @@ Prompt 是预置的工作流模板，用于特定任务。
 2. **先审后改**：重要修改前先让 AI 解释代码
 3. **备份优先**：关键文件操作前手动备份
 
+### Git 工作流
+
+1. **使用 Worktree**：多分支并行开发时使用 Git Worktree
+2. **规范提交**：使用 `/skill:commit` 生成规范提交消息
+3. **代码审查**：重要变更使用 `/skill:code-review` 审查
+
 ---
 
 ## 10. 故障排除
@@ -328,10 +410,11 @@ Prompt 是预置的工作流模板，用于特定任务。
 
 | 问题 | 解决方案 |
 |------|----------|
-| 启动慢 | 检查网络连接 |
-| 模型连接失败 | 核对 models.json 配置 |
-| 扩展不生效 | 运行 `/reload` 重载 |
+| 启动慢 | 检查网络连接，确认模型 API 可达 |
+| 模型连接失败 | 核对 `models.json` 配置和 API Key |
+| 扩展不生效 | 运行 `/reload` 重载配置 |
 | Token 溢出 | 使用 `/clear` 清理上下文 |
+| Skills 找不到 | 确认技能已安装到 `~/.aicode-cli/agent/skills/` |
 
 ### 详细模式
 
@@ -339,6 +422,12 @@ Prompt 是预置的工作流模板，用于特定任务。
 aicode-cli --verbose
 ```
 
+### 查看上下文
+
+```bash
+/context
+```
+
 ---
 
 ## 附录
@@ -347,8 +436,8 @@ aicode-cli --verbose
 
 | 变量 | 说明 |
 |------|------|
-| `AICODE_CLI_CONFIG_DIR` | 配置目录 |
-| `AICODE_CLI_CODING_AGENT_DIR` | Agent 配置目录 |
+| `AICODE_CLI_CONFIG_DIR` | 配置目录路径 |
+| `AICODE_CLI_CODING_AGENT_DIR` | Agent 配置目录路径 |
 
 ### 命令行参数
 
@@ -359,6 +448,12 @@ aicode-cli --verbose
 | `--model <name>` | 指定模型 |
 | `--clear` | 启动时清理会话 |
 
+### 相关资源
+
+- **项目仓库**: https://github.com/ia-ccun/code-agent-cli
+- **npm 包**: https://www.npmjs.com/package/@ia-ccun/code-agent-cli
+- **pi-coding-agent**: 底层 Agent 框架
+
 ---
 
 *世界那么哒 · AI 实践落地 @2026*

package/config/agent/settings.json

@@ -14,6 +14,9 @@
     "npm:pi-subagents",
     "npm:pi-rewind",
     "npm:pi-btw",
-    "npm:pi-mcp-adapter"
+    "npm:pi-mcp-adapter",
+    "npm:juicesharp/rpiv-todo",
+    "npm:juicesharp/rpiv-ask-user-question",
+    "npm:@juicesharp/rpiv-advisor"
   ]
 }

package/config/agent/skills/frontend-slides/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Zara Zhang
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/config/agent/skills/frontend-slides/README.md

@@ -0,0 +1,136 @@
+# Frontend Slides
+
+A Claude Code skill for creating stunning, animation-rich HTML presentations — from scratch or by converting PowerPoint files.
+
+## What This Does
+
+**Frontend Slides** helps non-designers create beautiful web presentations without knowing CSS or JavaScript. It uses a "show, don't tell" approach: instead of asking you to describe your aesthetic preferences in words, it generates visual previews and lets you pick what you like.
+
+Here is a deck about the skill, made through the skill:
+
+https://github.com/user-attachments/assets/ef57333e-f879-432a-afb9-180388982478
+
+
+### Key Features
+
+- **Zero Dependencies** — Single HTML files with inline CSS/JS. No npm, no build tools, no frameworks.
+- **Visual Style Discovery** — Can't articulate design preferences? No problem. Pick from generated visual previews.
+- **PPT Conversion** — Convert existing PowerPoint files to web, preserving all images and content.
+- **Anti-AI-Slop** — Curated distinctive styles that avoid generic AI aesthetics (bye-bye, purple gradients on white).
+- **Production Quality** — Accessible, responsive, well-commented code you can customize.
+
+## Installation
+
+### For Claude Code Users
+
+Copy the skill files to your Claude Code skills directory:
+
+```bash
+# Create the skill directory
+mkdir -p ~/.claude/skills/frontend-slides/scripts
+
+# Copy all files (or clone this repo directly)
+cp SKILL.md STYLE_PRESETS.md viewport-base.css html-template.md animation-patterns.md ~/.claude/skills/frontend-slides/
+cp scripts/extract-pptx.py ~/.claude/skills/frontend-slides/scripts/
+```
+
+Or clone directly:
+
+```bash
+git clone https://github.com/zarazhangrui/frontend-slides.git ~/.claude/skills/frontend-slides
+```
+
+Then use it by typing `/frontend-slides` in Claude Code.
+
+## Usage
+
+### Create a New Presentation
+
+```
+/frontend-slides
+
+> "I want to create a pitch deck for my AI startup"
+```
+
+The skill will:
+1. Ask about your content (slides, messages, images)
+2. Ask about the feeling you want (impressed? excited? calm?)
+3. Generate 3 visual style previews for you to compare
+4. Create the full presentation in your chosen style
+5. Open it in your browser
+
+### Convert a PowerPoint
+
+```
+/frontend-slides
+
+> "Convert my presentation.pptx to a web slideshow"
+```
+
+The skill will:
+1. Extract all text, images, and notes from your PPT
+2. Show you the extracted content for confirmation
+3. Let you pick a visual style
+4. Generate an HTML presentation with all your original assets
+
+## Included Styles
+
+### Dark Themes
+- **Bold Signal** — Confident, high-impact, vibrant card on dark
+- **Electric Studio** — Clean, professional, split-panel
+- **Creative Voltage** — Energetic, retro-modern, electric blue + neon
+- **Dark Botanical** — Elegant, sophisticated, warm accents
+
+### Light Themes
+- **Notebook Tabs** — Editorial, organized, paper with colorful tabs
+- **Pastel Geometry** — Friendly, approachable, vertical pills
+- **Split Pastel** — Playful, modern, two-color vertical split
+- **Vintage Editorial** — Witty, personality-driven, geometric shapes
+
+### Specialty
+- **Neon Cyber** — Futuristic, particle backgrounds, neon glow
+- **Terminal Green** — Developer-focused, hacker aesthetic
+- **Swiss Modern** — Minimal, Bauhaus-inspired, geometric
+- **Paper & Ink** — Literary, drop caps, pull quotes
+
+## Architecture
+
+This skill uses **progressive disclosure** — the main `SKILL.md` is a concise map (~180 lines), with supporting files loaded on-demand only when needed:
+
+| File | Purpose | Loaded When |
+|------|---------|-------------|
+| `SKILL.md` | Core workflow and rules | Always (skill invocation) |
+| `STYLE_PRESETS.md` | 12 curated visual presets | Phase 2 (style selection) |
+| `viewport-base.css` | Mandatory responsive CSS | Phase 3 (generation) |
+| `html-template.md` | HTML structure and JS features | Phase 3 (generation) |
+| `animation-patterns.md` | CSS/JS animation reference | Phase 3 (generation) |
+| `scripts/extract-pptx.py` | PPT content extraction | Phase 4 (conversion) |
+
+This design follows [OpenAI's harness engineering](https://openai.com/index/harness-engineering/) principle: "give the agent a map, not a 1,000-page instruction manual."
+
+## Philosophy
+
+This skill was born from the belief that:
+
+1. **You don't need to be a designer to make beautiful things.** You just need to react to what you see.
+
+2. **Dependencies are debt.** A single HTML file will work in 10 years. A React project from 2019? Good luck.
+
+3. **Generic is forgettable.** Every presentation should feel custom-crafted, not template-generated.
+
+4. **Comments are kindness.** Code should explain itself to future-you (or anyone else who opens it).
+
+## Requirements
+
+- [Claude Code](https://claude.ai/claude-code) CLI
+- For PPT conversion: Python with `python-pptx` library
+
+## Credits
+
+Created by [@zarazhangrui](https://github.com/zarazhangrui) with Claude Code.
+
+Inspired by the "Vibe Coding" philosophy — building beautiful things without being a traditional software engineer.
+
+## License
+
+MIT — Use it, modify it, share it.