/ 目錄 / 演練場 / craftcms-claude-skills
● 社群 michtio ⚡ 即開即用

craftcms-claude-skills

作者 michtio · michtio/craftcms-claude-skills

一套深度了解 Craft CMS 5 的 Claude Code 技能包——以 Craft 的方式撰寫模組、Twig 模板、資料庫遷移與 GraphQL 查詢。

生產就緒的技能、代理與專案範本,教會 Claude Code Craft CMS 5 的實際運作方式。不再給出通用的 PHP 建議,而是提供符合慣例的 Craft 模式——正確的元素查詢、欄位 handle、模組結構,以及 Pixel & Tonic 開發規範。

為什麼要用

核心特性

即時演示

實際使用效果

craftcms-claude-skill.replay ▶ 就緒
0/0

安裝

選擇你的客戶端

~/Library/Application Support/Claude/claude_desktop_config.json  · Windows: %APPDATA%\Claude\claude_desktop_config.json
{
  "mcpServers": {
    "craftcms-claude-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/michtio/craftcms-claude-skills",
        "~/.claude/skills/craftcms-claude-skills"
      ],
      "_inferred": true
    }
  }
}

開啟 Claude Desktop → Settings → Developer → Edit Config。儲存後重啟應用。

~/.cursor/mcp.json · .cursor/mcp.json
{
  "mcpServers": {
    "craftcms-claude-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/michtio/craftcms-claude-skills",
        "~/.claude/skills/craftcms-claude-skills"
      ],
      "_inferred": true
    }
  }
}

Cursor 使用與 Claude Desktop 相同的 mcpServers 格式。專案級設定優先於全域。

VS Code → Cline → MCP Servers → Edit
{
  "mcpServers": {
    "craftcms-claude-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/michtio/craftcms-claude-skills",
        "~/.claude/skills/craftcms-claude-skills"
      ],
      "_inferred": true
    }
  }
}

點擊 Cline 側欄中的 MCP Servers 圖示,然後選 "Edit Configuration"。

~/.codeium/windsurf/mcp_config.json
{
  "mcpServers": {
    "craftcms-claude-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/michtio/craftcms-claude-skills",
        "~/.claude/skills/craftcms-claude-skills"
      ],
      "_inferred": true
    }
  }
}

格式與 Claude Desktop 相同。重啟 Windsurf 生效。

~/.continue/config.json
{
  "mcpServers": [
    {
      "name": "craftcms-claude-skill",
      "command": "git",
      "args": [
        "clone",
        "https://github.com/michtio/craftcms-claude-skills",
        "~/.claude/skills/craftcms-claude-skills"
      ]
    }
  ]
}

Continue 使用伺服器物件陣列,而非映射。

~/.config/zed/settings.json
{
  "context_servers": {
    "craftcms-claude-skill": {
      "command": {
        "path": "git",
        "args": [
          "clone",
          "https://github.com/michtio/craftcms-claude-skills",
          "~/.claude/skills/craftcms-claude-skills"
        ]
      }
    }
  }
}

加入 context_servers。Zed 儲存後熱重載。

claude mcp add craftcms-claude-skill -- git clone https://github.com/michtio/craftcms-claude-skills ~/.claude/skills/craftcms-claude-skills

一行命令搞定。用 claude mcp list 驗證,claude mcp remove 移除。

使用場景

實戰用法: craftcms-claude-skills

在 Claude Code 中直接建立 Craft CMS 自訂模組

👤 開發網站專屬模組的 Craft CMS 開發者 ⏱ ~30 min intermediate

何時使用: 需要建立新模組,但不想手動複製現有模組當範本時。

前置條件
  • 在本機設定好 Craft CMS 5 專案 — composer create-project craftcms/craft my-project
  • 已 clone 技能包 — git clone https://github.com/michtio/craftcms-claude-skills ~/.claude/skills/craftcms-claude-skills
步驟
  1. 描述模組的用途
    Use craftcms-claude-skills. Create a new module called 'Inventory' that registers a custom element type for warehouse items.✓ 已複製
    → Claude 建立 modules/inventory/ 目錄,包含 src/Inventory.php、elements/WarehouseItem.php 及設定項目
  2. 完成接入設定
    Register the module in config/app.php and add the bootstrap entry.✓ 已複製
    → 顯示設定檔差異;執行 craft setup/check 時模組可正常載入
  3. 新增元素查詢
    Add a WarehouseItemQuery class with a custom 'sku' parameter that filters on the content table.✓ 已複製
    → 查詢類別包含正確的 WHERE 子句,而非雜亂的原始 SQL

結果: 一個符合 Pixel & Tonic 開發規範的可運行 Craft 模組——可直接進行第一次資料庫遷移。

注意事項
  • Claude 產出 Craft 3/4 風格的程式碼 — 每次提示都明確指定 Craft CMS 5——API 介面已有所變動
搭配使用: filesystem · mysql

將雜亂的 Twig 模板重構為符合 Craft 慣例的版本

👤 接手含有問題模板之 Craft 網站的前端開發者 ⏱ ~45 min intermediate

何時使用: 接手一個 Craft 專案,發現模板中充斥著原始 SQL、內嵌 PHP 以及失效的快取標籤時。

步驟
  1. 將 Claude 指向最糟糕的模板
    Using craftcms-claude-skills, review templates/_entries/blog.twig and rewrite it using proper element queries and {% cache %} tags.✓ 已複製
    → 重構後的模板使用 craft.entries、section handle 及正確的快取範圍
  2. 提取可重用的 macro
    Pull the card markup into a macro in _macros/cards.twig and include it properly.✓ 已複製
    → 建立 macro 檔案;引入時使用 {% from %} 語法

結果: 載入更快、後續開發者也能看懂的模板。

注意事項
  • 快取標籤包裹了動態使用者資料,導致顯示錯誤內容 — 使用帶有全域鍵值變體的 {% cache %},絕對不要包裹已登入使用者的資料
搭配使用: filesystem

為內容模型變更撰寫安全的 Craft 遷移檔

👤 需要將 schema 變更部署至正式環境的 Craft 開發者 ⏱ ~30 min advanced

何時使用: 新增欄位或調整現有欄位結構,需要一份不會造成資料遺失的遷移檔時。

步驟
  1. 描述變更內容
    Use craftcms-claude-skills. Write a Craft migration that adds a 'featuredAt' datetime field to the News section, with a safe backfill from postDate.✓ 已複製
    → 遷移檔包含 safeUp / safeDown;使用 Craft 的 Fields service,而非直接操作 schema
  2. 在開發環境進行演練
    Walk me through testing this with ./craft migrate/up --interactive=0 on a staging copy first.✓ 已複製
    → 逐步清單,包含資料庫備份步驟

結果: 一份可以在週五安心部署的遷移檔。

注意事項
  • 忘記在專案設定中註冊欄位類型 — 遷移完成後務必執行 craft project-config/write,並將 YAML 提交至版本控制
搭配使用: mysql · git

組合

與其他 MCP 搭配,撬動十倍槓桿

craftcms-claude-skill + filesystem

技能包提供 Craft 模式;filesystem 讓 Claude 實際套用至你的專案目錄

Apply the craftcms-claude-skills module scaffold to my current project directory.✓ 已複製
craftcms-claude-skill + mysql

在撰寫遷移檔時檢視 Craft 的內容資料表

Show me the current schema of the elements_sites table before I write this migration.✓ 已複製

工具

此 MCP 暴露的能力

工具輸入參數何時呼叫成本
module_scaffold module name, element types 開始建立新模組時 0
field_generator field name, type, handle 新增自訂欄位類型時 0
twig_refactor template path 整理舊有模板時 0

成本與限制

運行它的成本

API 配額
None
每次呼叫 Token 數
中等——參考檔案按需載入
費用
Free
提示
僅在處理 Craft 相關程式碼時才引用此技能包;在無關任務中使用會增加不必要的上下文開銷。

安全

權限、密鑰、影響範圍

憑證儲存: 無需憑證
資料出站: 無——僅使用本機提示與檔案

故障排查

常見錯誤與修復

Claude generates Craft 3-era code (craft()->elements)

明確提及「Craft CMS 5」;5.x 的 API 命名空間為 craft\elements

驗證: grep -r 'craft()->' src/ should return nothing in Craft 5 code
Migration runs but field doesn't appear in CP

執行 ./craft project-config/write 及 ./craft project-config/apply——通常是專案設定不同步所致

驗證: ./craft project-config/diff
Skill not triggered on Craft prompts

以名稱明確呼叫:「use craftcms-claude-skills」。並確認 SKILL.md 檔案存在。

驗證: ls ~/.claude/skills/craftcms-claude-skills/SKILL.md

替代方案

craftcms-claude-skills 對比其他方案

替代方案何時用它替代權衡
Raw Claude Code僅需修改 Twig 且不需要 Craft 特定慣例的簡單情境給出通用 PHP 建議,往往不適用於 Craft
symfony-hexagonal-skill使用 Symfony 而非 Craft 時不同的框架開發規範

更多

資源

📖 閱讀 GitHub 上的官方 README

🐙 查看未解決的 issue

🔍 瀏覽全部 400+ MCP 伺服器和 Skills