extension-createlisted
Install: claude install-skill andrewr303/claude-codex-plugin-lab
# Extension Create (WXT & Plasmo)
Auto-scaffold a Chrome extension project. Do NOT just explain — execute the workflow.
## Workflow (Execute This)
### Step 1: Gather requirements from user
Ask the user to confirm:
1. **Extension name** (kebab-case, e.g. `my-tab-manager`)
2. **Short description** (1 sentence)
3. **UI framework**: React / Vue / Svelte / Vanilla (default: React)
4. **Features needed** (pick from list below):
- Popup UI
- Content script (modify pages)
- Background service worker
- Side panel
- Options page
- Context menu
- Tab management / Storage / Active tab only
### Step 2: Pick scaffolder based on framework choice
| Framework | Recommended Scaffolder | Why |
|-----------|----------------------|-----|
| React | **Plasmo** or WXT | Plasmo has CSUI, quickstarts |
| Vue | **WXT** | First-class Vue support |
| Svelte | **WXT** | First-class Svelte support |
| Vanilla TS | **WXT** | Lightest setup |
### Step 3: Scaffold
**WXT** — multi-framework, file-based entrypoints:
```bash
npx wxt@latest init <name> --template <react|vue|svelte|vanilla>
cd <name> && pnpm install
```
**Plasmo** — React-first, auto-manifest, rich quickstarts:
```bash
# Basic React
npm create plasmo --with-src
# With Tailwind CSS
npm create plasmo -- --with-tailwindcss
# With specific template (see https://docs.plasmo.com/quickstarts)
npm create plasmo -- --with-redux
```
Quickstarts: https://docs.plasmo.com/quickstarts
Full docs: https://docs.plasmo.com/
### Step 3