update: add Webflow CLI skills documentation

.claude-plugin/marketplace.json

@@ -15,6 +15,15 @@
       },
       "source": "./plugins/webflow-skills",
       "category": "productivity"
+    },
+    {
+      "name": "webflow-cli-skills",
+      "description": "Automate Webflow CLI workflows including Code Components, DevLink sync, Webflow Cloud deployments, and Designer Extensions",
+      "author": {
+        "name": "Webflow"
+      },
+      "source": "./plugins/webflow-cli-skills",
+      "category": "developer-tools"
     }
   ]
 }

.gitignore

@@ -29,4 +29,5 @@ tmp/
 temp/
 *.tmp
 
-.mcp.json
+.mcp.json
+notes.md

AGENTS.md

@@ -726,3 +726,122 @@ Solution:
 **Report results**: Successes, failures, next steps
 
 **Handle errors**: Explain, suggest recovery, report partial success
+
+---
+
+## Webflow CLI Skills
+
+You have access to Webflow CLI skills for development workflows. These skills use the Bash tool to execute `webflow` CLI commands.
+
+### Prerequisites
+
+**⚠️ IMPORTANT: Webflow CLI Required**
+
+These skills require the Webflow CLI to be installed and authenticated:
+
+```bash
+# Install CLI (use npm, pnpm, or yarn)
+npm install -g @webflow/cli
+
+# Authenticate
+webflow auth login
+
+# Verify
+webflow --version
+```
+
+### Package Manager Detection
+
+**ALWAYS detect package manager before running install commands:**
+
+1. **Check for lock files** in project directory:
+   - `package-lock.json` → use npm
+   - `pnpm-lock.yaml` → use pnpm
+   - `yarn.lock` → use yarn
+
+2. **If no lock file found**, ask user:
+   ```
+   Which package manager would you like to use?
+   - npm (default)
+   - pnpm
+   - yarn
+   ```
+
+3. **Use detected/selected package manager** for all commands:
+   - npm: `npm install`, `npm run build`
+   - pnpm: `pnpm install`, `pnpm run build`
+   - yarn: `yarn install`, `yarn build`
+
+### Available CLI Skills
+
+#### Development Workflows
+
+- **code-component**: Create and deploy Code Components for Webflow Designer
+  - Commands: `webflow library bundle`, `webflow library share`, `webflow library log`
+  - Workflow: configure webflow.json → build → bundle → share
+  - Schema: `library` section in webflow.json
+
+- **devlink**: Export Webflow designs to React/Next.js code
+  - Commands: `webflow devlink sync`
+  - Workflow: configure → sync → integrate
+  - Schema: `devlink` section in webflow.json
+
+- **webflow-cloud**: Deploy full-stack apps to Webflow Cloud
+  - Commands: `webflow cloud list`, `webflow cloud init`, `webflow cloud deploy`
+  - Workflow: init → build → deploy → verify
+  - Schema: `cloud` section in webflow.json
+
+- **designer-extension**: Build Designer Extensions
+  - Commands: `webflow extension list`, `webflow extension init`, `webflow extension bundle`, `webflow extension serve`
+  - Workflow: list → init → serve → bundle → upload
+  - Schema: Extension config in webflow.json
+
+#### CLI Diagnostics
+
+- **webflow-cli-troubleshooter**: Diagnose and fix CLI issues
+  - Flags: `--version`, `--help`, `--verbose`, `--debug-bundler`
+  - Workflow: identify → diagnose → fix → verify
+
+### When to Use CLI Skills
+
+**Use CLI skills when user asks to run commands for:**
+- Code Components (`webflow library` commands)
+- DevLink (`webflow devlink` commands)
+- Webflow Cloud (`webflow cloud` commands)
+- Designer Extensions (`webflow extension` commands)
+- CLI troubleshooting and diagnostics
+
+### Key Patterns
+
+**CLI Verification:**
+```bash
+# Check CLI installed
+webflow --version
+
+# Authenticate if needed
+webflow auth login
+```
+
+**Diagnostic Flags:**
+- `--verbose` - Detailed output for debugging
+- `--debug-bundler` - Show bundler configuration
+- `--help` - Command syntax and options
+
+**File Operations:**
+- Use Read tool to examine files (never modify)
+- Let CLI generate/modify files
+- Preview generated content before operations
+
+**Bash Tool Usage:**
+- Execute all `webflow` commands via Bash tool
+- Provide clear descriptions (not context parameters)
+- Display CLI output to user
+- Check exit codes
+
+### Resources
+
+- **CLI Reference**: [Complete CLI documentation](https://developers.webflow.com/cli/reference/webflow-cli)
+- **Code Components**: [Building Components](https://developers.webflow.com/cli/code-components)
+- **DevLink**: [DevLink Guide](https://developers.webflow.com/devlink)
+- **Webflow Cloud**: [Cloud Apps](https://developers.webflow.com/cli/cloud-apps)
+- **Extensions**: [Designer Extensions](https://developers.webflow.com/cli/extensions)

README.md

@@ -94,10 +94,70 @@ Copy the `skills/` directory to your agent's skills location, or reference the `
 - **safe-publish** - Preview → Confirm → Publish workflow with verification
 - **custom-code-management** - Manage tracking scripts and custom code safely
 
+---
+
+## Webflow CLI Skills
+
+In addition to the MCP-based skills above, this repository includes **webflow-cli-skills** for Webflow CLI workflows.
+
+### Prerequisites for Webflow CLI Skills
+
+**⚠️ IMPORTANT: Webflow CLI Required**
+
+CLI skills require the [Webflow CLI](https://developers.webflow.com/cli) to be installed and authenticated.
+
+## Installation
+
+### Claude Code (via Marketplace)
+
+```bash
+# Add the marketplace
+claude plugin marketplace add webflow/webflow-skills
+
+# Install the plugin
+claude plugin install webflow-skills@webflow-cli-skills
+```
+
+### Claude Code (from local clone)
+
+```bash
+# Install Webflow CLI skills plugin
+claude plugin install ~/webflow-skills/plugins/webflow-cli-skills
+```
+
+### Available Webflow CLI Skills
+
+#### Development Workflows
+- **code-component** - Create and deploy React components for Webflow Designer
+- **devlink** - Export Webflow components to React/Next.js code
+- **webflow-cloud** - Deploy full-stack apps to Webflow Cloud
+- **designer-extension** - Build Designer Extensions for Webflow Designer
+
+#### CLI Diagnostics
+- **webflow-cli-troubleshooter** - Diagnose and fix CLI issues
+
+### When to Use Webflow CLI Skills vs MCP Skills
+
+**Use MCP Skills (webflow-skills) for:**
+- CMS content management
+- Site auditing and optimization
+- Asset management
+- Publishing workflows
+
+**Use Webflow CLI Skills (webflow-cli-skills) when user asks to run commands for:**
+- Code Components (`webflow library` commands)
+- DevLink (`webflow devlink` commands)
+- Webflow Cloud (`webflow cloud` commands)
+- Designer Extensions (`webflow extension` commands)
+- CLI troubleshooting and diagnostics
+
+---
+
 ## Resources
 
 - **Prompt Library**: [Ready-to-use example prompts](https://developers.webflow.com/mcp/v1.0.0/examples) to get started quickly
 - **Available Tools**: [Complete tool reference](https://developers.webflow.com/mcp/v1.0.0/reference/how-it-works#available-tools) for all Webflow MCP capabilities
+- **Webflow CLI**: [Complete CLI reference](https://developers.webflow.com/cli/reference/webflow-cli) for all Webflow CLI commands
 
 ## License
 

plugins/webflow-cli-skills/.claude-plugin/plugin.json

@@ -0,0 +1,6 @@
+{
+  "name": "webflow-cli-skills",
+  "description": "Production-ready skills for Webflow CLI workflows including Code Components, DevLink, Webflow Cloud, and Designer Extensions",
+  "version": "1.0.0",
+  "skills": "./skills/"
+}