create-addfox-app 0.1.1-beta.15 → 0.1.1-beta.16

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-addfox-app",
-  "version": "0.1.1-beta.15",
+  "version": "0.1.1-beta.16",
   "description": "Interactive scaffolder for addfox extension projects",
   "license": "MIT",
   "type": "module",
@@ -17,7 +17,7 @@
     "prompts": "^2.4.2",
     "kolorist": "^1.8.0",
     "minimist": "^1.2.8",
-    "@addfox/pkg-manager": "0.1.1-beta.8"
+    "@addfox/pkg-manager": "0.1.1-beta.9"
   },
   "devDependencies": {
     "@rslib/core": "^0.20.0",

package/templates/template-preact-js/AGENTS.md

@@ -0,0 +1,54 @@
+# AI Agent Guide - Preact Addfox Extension
+
+> **Priority**: Follow `.agents/skills/` first, then this guide, then [official docs](https://addfox.dev)
+
+## Project Overview
+
+Preact browser extension using Addfox build tool. Uses `@rsbuild/plugin-preact` for JSX support.
+
+## Key Configuration Fields (addfox.config.js)
+
+### Required Fields
+
+- **`manifest`** - Extension manifest.json content
+  - Supports `chromium` and `firefox` variants
+  - Addfox auto-injects entry paths
+
+- **`plugins`** - Rsbuild plugins array
+  - Must include `pluginPreact()` for JSX support
+
+### Optional Fields (use when needed)
+
+- **`appDir`** - Source directory (default: "app")
+- **`outDir`** - Build output directory
+- **`entry`** - Manual entry mapping
+- **`hotReload`** - Dev server settings
+- **`debug`** - Enable debug logging
+- **`zip`** - Output zip configuration
+- **`rsbuild`** - Override Rsbuild configuration
+
+## Entry Structure
+
+Entries auto-discovered from `appDir` subdirectories. Each needs `index.jsx` as entry.
+
+## Framework-Specific Notes
+
+### Preact
+
+- JSX-based (`.jsx` files)
+- React-compatible API with smaller bundle size
+
+### Browser Extension APIs
+
+- Install `webextension-polyfill` for cross-browser compatibility
+
+### Styling
+
+- Supports CSS Modules
+- Content scripts: use `@addfox/utils` with Shadow DOM
+
+## Resources
+
+- Addfox docs: https://addfox.dev
+- Rsbuild Preact plugin: https://rsbuild.dev/plugins/list/plugin-preact
+- Preact docs: https://preactjs.com

package/templates/template-preact-ts/AGENTS.md

@@ -0,0 +1,61 @@
+# AI Agent Guide - Preact Addfox Extension
+
+> **Priority**: Follow `.agents/skills/` first, then this guide, then [official docs](https://addfox.dev)
+
+## Project Overview
+
+Preact browser extension using Addfox build tool. Uses `@rsbuild/plugin-preact` for JSX support.
+
+## Key Configuration Fields (addfox.config.ts)
+
+### Required Fields
+
+- **`manifest`** - Extension manifest.json content
+  - Supports `chromium` and `firefox` variants
+  - Addfox auto-injects entry paths
+
+- **`plugins`** - Rsbuild plugins array
+  - Must include `pluginPreact()` for JSX support
+
+### Optional Fields (use when needed)
+
+- **`appDir`** - Source directory (default: "app")
+- **`outDir`** - Build output directory
+- **`entry`** - Manual entry mapping
+- **`hotReload`** - Dev server settings
+- **`debug`** - Enable debug logging
+- **`zip`** - Output zip configuration
+- **`rsbuild`** - Override Rsbuild configuration
+
+## Entry Structure
+
+Entries auto-discovered from `appDir` subdirectories:
+
+- `app/background/` → Service Worker (index.ts)
+- `app/content/` → Content Script (index.ts)
+- `app/popup/` → Popup page (index.tsx + App.tsx)
+- `app/options/` → Options page
+- `app/sidepanel/` → Side panel
+
+## Framework-Specific Notes
+
+### Preact
+
+- JSX-based (`.tsx` files)
+- React-compatible API with smaller bundle size
+- TypeScript support enabled
+
+### Browser Extension APIs
+
+- Install `webextension-polyfill` for cross-browser compatibility
+
+### Styling
+
+- Supports CSS Modules
+- Content scripts: use `@addfox/utils` with Shadow DOM
+
+## Resources
+
+- Addfox docs: https://addfox.dev
+- Rsbuild Preact plugin: https://rsbuild.dev/plugins/list/plugin-preact
+- Preact docs: https://preactjs.com

package/templates/template-react-js/AGENTS.md

@@ -0,0 +1,66 @@
+# AI Agent Guide - React Addfox Extension
+
+> **Priority**: Follow `.agents/skills/` first, then this guide, then [official docs](https://addfox.dev)
+
+## Project Overview
+
+React-based browser extension using Addfox build tool. Uses `@rsbuild/plugin-react` for JSX support and React Fast Refresh.
+
+## Key Configuration Fields (addfox.config.js)
+
+### Required Fields
+
+- **`manifest`** - Extension manifest.json content
+  - Supports `chromium` and `firefox` variants for browser-specific differences
+  - Addfox auto-injects entry paths - don't hardcode them
+
+- **`plugins`** - Rsbuild plugins array
+  - Must include `pluginReact()` for JSX support
+
+### Optional Fields (use when needed)
+
+- **`appDir`** - Source directory (default: "app")
+- **`outDir`** - Build output directory (default: ".addfox/extension")
+- **`entry`** - Manual entry mapping (when auto-discovery fails)
+- **`hotReload`** - Dev server settings (port, auto-refresh)
+- **`debug`** - Enable debug logging
+- **`zip`** - Output zip configuration
+- **`rsbuild`** - Override Rsbuild configuration
+
+## Entry Structure
+
+Entries auto-discovered from `appDir` subdirectories:
+
+- `app/background/` → Service Worker
+- `app/content/` → Content Script
+- `app/popup/` → Popup page
+- `app/options/` → Options page
+- `app/sidepanel/` → Side panel
+- `app/devtools/` → DevTools page
+
+Each needs `index.jsx` as entry point.
+
+## Framework-Specific Notes
+
+### React/JSX
+
+- Files use `.jsx` extension
+- React Fast Refresh enabled in dev mode
+- JSX transform automatic
+
+### Browser Extension APIs
+
+- Install `webextension-polyfill` for cross-browser compatibility
+- Import: `import browser from "webextension-polyfill"`
+
+### Styling
+
+- Supports CSS Modules
+- Supports Tailwind if configured
+- Content scripts: use `@addfox/utils` with Shadow DOM for isolation
+
+## Resources
+
+- Addfox docs: https://addfox.dev
+- Rsbuild React plugin: https://rsbuild.dev/plugins/list/plugin-react
+- WebExtension API: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API

package/templates/template-react-ts/AGENTS.md

@@ -0,0 +1,93 @@
+# AI Agent Guide - React Addfox Extension
+
+> **Priority**: Follow `.agents/skills/` first, then this guide, then [official docs](https://addfox.dev)
+
+## Project Overview
+
+React-based browser extension using Addfox build tool. Uses `@rsbuild/plugin-react` for JSX/TSX support and React Fast Refresh.
+
+## Key Configuration Fields (addfox.config.ts)
+
+### Required Fields
+
+- **`manifest`** - Extension manifest.json content
+  - Supports `chromium` and `firefox` variants for browser-specific differences
+  - Addfox auto-injects entry paths (popup, background, etc.) - don't hardcode them
+
+- **`plugins`** - Rsbuild plugins array
+  - Must include `pluginReact()` for JSX/TSX support
+  - Add other Rsbuild plugins as needed
+
+### Optional Fields (use when needed)
+
+- **`appDir`** - Source directory (default: "app")
+  - Change if source files are in a different folder
+
+- **`outDir`** - Build output directory (default: ".addfox/extension")
+  - Change for custom output location
+
+- **`entry`** - Manual entry point mapping
+  - Only needed when auto-discovery fails or custom structure
+
+- **`hotReload`** - Dev server settings
+  - `port`: WebSocket port (default: 23333)
+  - `autoRefreshContentPage`: Auto-refresh on content changes
+
+- **`debug`** - Enable debug logging (default: false)
+
+- **`zip`** - Output zip configuration for distribution
+
+- **`rsbuild`** - Override Rsbuild configuration directly
+
+## Entry Structure
+
+Entries auto-discovered from `appDir` subdirectories:
+
+- `app/background/` → Service Worker
+- `app/content/` → Content Script  
+- `app/popup/` → Popup page
+- `app/options/` → Options page
+- `app/sidepanel/` → Side panel
+- `app/devtools/` → DevTools page
+
+Each needs `index.tsx` as entry point.
+
+## Framework-Specific Notes
+
+### React/JSX
+
+- Files use `.tsx` extension
+- React Fast Refresh enabled in dev mode
+- JSX transform automatic (no need to import React)
+
+### Browser Extension APIs
+
+- Install `webextension-polyfill` for cross-browser compatibility
+- Import: `import browser from "webextension-polyfill"`
+
+### Styling
+
+- Supports CSS Modules: `import styles from "./App.module.css"`
+- Supports Tailwind if configured
+- For content scripts: use `@addfox/utils` with Shadow DOM for isolation
+
+## Common Tasks
+
+Adding a new entry:
+1. Create `app/<entry-name>/index.tsx`
+2. Addfox auto-detects - no config change needed
+3. Reference in manifest if needed (paths auto-injected)
+
+Adding permissions:
+1. Edit `manifest.permissions` in config
+2. Firefox may need different permission format
+
+Cross-browser manifest differences:
+- Use `manifest.chromium` and `manifest.firefox` objects
+- Common fields go in both, differences separated
+
+## Resources
+
+- Addfox docs: https://addfox.dev
+- Rsbuild React plugin: https://rsbuild.dev/plugins/list/plugin-react
+- WebExtension API: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API

package/templates/template-solid-js/AGENTS.md

@@ -0,0 +1,54 @@
+# AI Agent Guide - Solid Addfox Extension
+
+> **Priority**: Follow `.agents/skills/` first, then this guide, then [official docs](https://addfox.dev)
+
+## Project Overview
+
+SolidJS browser extension using Addfox build tool. Uses `@rsbuild/plugin-solid` for Solid support.
+
+## Key Configuration Fields (addfox.config.js)
+
+### Required Fields
+
+- **`manifest`** - Extension manifest.json content
+  - Supports `chromium` and `firefox` variants
+  - Addfox auto-injects entry paths
+
+- **`plugins`** - Rsbuild plugins array
+  - Must include `pluginSolid()` for Solid JSX support
+
+### Optional Fields (use when needed)
+
+- **`appDir`** - Source directory (default: "app")
+- **`outDir`** - Build output directory
+- **`entry`** - Manual entry mapping
+- **`hotReload`** - Dev server settings
+- **`debug`** - Enable debug logging
+- **`zip`** - Output zip configuration
+- **`rsbuild`** - Override Rsbuild configuration
+
+## Entry Structure
+
+Entries auto-discovered from `appDir` subdirectories. Each needs `index.jsx` as entry.
+
+## Framework-Specific Notes
+
+### SolidJS
+
+- JSX-based (`.jsx` files)
+- Fine-grained reactivity with signals
+
+### Browser Extension APIs
+
+- Install `webextension-polyfill` for cross-browser compatibility
+
+### Styling
+
+- Supports CSS Modules
+- Content scripts: use `@addfox/utils` with Shadow DOM
+
+## Resources
+
+- Addfox docs: https://addfox.dev
+- Rsbuild Solid plugin: https://rsbuild.dev/plugins/list/plugin-solid
+- Solid docs: https://www.solidjs.com

package/templates/template-solid-ts/AGENTS.md

@@ -0,0 +1,61 @@
+# AI Agent Guide - Solid Addfox Extension
+
+> **Priority**: Follow `.agents/skills/` first, then this guide, then [official docs](https://addfox.dev)
+
+## Project Overview
+
+SolidJS browser extension using Addfox build tool. Uses `@rsbuild/plugin-solid` for Solid support.
+
+## Key Configuration Fields (addfox.config.ts)
+
+### Required Fields
+
+- **`manifest`** - Extension manifest.json content
+  - Supports `chromium` and `firefox` variants
+  - Addfox auto-injects entry paths
+
+- **`plugins`** - Rsbuild plugins array
+  - Must include `pluginSolid()` for Solid JSX support
+
+### Optional Fields (use when needed)
+
+- **`appDir`** - Source directory (default: "app")
+- **`outDir`** - Build output directory
+- **`entry`** - Manual entry mapping
+- **`hotReload`** - Dev server settings
+- **`debug`** - Enable debug logging
+- **`zip`** - Output zip configuration
+- **`rsbuild`** - Override Rsbuild configuration
+
+## Entry Structure
+
+Entries auto-discovered from `appDir` subdirectories:
+
+- `app/background/` → Service Worker (index.ts)
+- `app/content/` → Content Script (index.ts)
+- `app/popup/` → Popup page (index.tsx + App.tsx)
+- `app/options/` → Options page
+- `app/sidepanel/` → Side panel
+
+## Framework-Specific Notes
+
+### SolidJS
+
+- JSX-based (`.tsx` files)
+- Fine-grained reactivity with signals
+- TypeScript support enabled
+
+### Browser Extension APIs
+
+- Install `webextension-polyfill` for cross-browser compatibility
+
+### Styling
+
+- Supports CSS Modules
+- Content scripts: use `@addfox/utils` with Shadow DOM
+
+## Resources
+
+- Addfox docs: https://addfox.dev
+- Rsbuild Solid plugin: https://rsbuild.dev/plugins/list/plugin-solid
+- Solid docs: https://www.solidjs.com

package/templates/template-svelte-js/AGENTS.md

@@ -0,0 +1,54 @@
+# AI Agent Guide - Svelte Addfox Extension
+
+> **Priority**: Follow `.agents/skills/` first, then this guide, then [official docs](https://addfox.dev)
+
+## Project Overview
+
+Svelte browser extension using Addfox build tool. Uses `@rsbuild/plugin-svelte` for Svelte support.
+
+## Key Configuration Fields (addfox.config.js)
+
+### Required Fields
+
+- **`manifest`** - Extension manifest.json content
+  - Supports `chromium` and `firefox` variants
+  - Addfox auto-injects entry paths
+
+- **`plugins`** - Rsbuild plugins array
+  - Must include `pluginSvelte()` for Svelte support
+
+### Optional Fields (use when needed)
+
+- **`appDir`** - Source directory (default: "app")
+- **`outDir`** - Build output directory
+- **`entry`** - Manual entry mapping
+- **`hotReload`** - Dev server settings
+- **`debug`** - Enable debug logging
+- **`zip`** - Output zip configuration
+- **`rsbuild`** - Override Rsbuild configuration
+
+## Entry Structure
+
+Entries auto-discovered from `appDir` subdirectories. Each needs `index.js` as entry.
+
+## Framework-Specific Notes
+
+### Svelte
+
+- Single File Components (`.svelte` files)
+- Reactive statements with `$:`
+
+### Browser Extension APIs
+
+- Install `webextension-polyfill` for cross-browser compatibility
+
+### Styling
+
+- Svelte scoped styles by default
+- Content scripts: use `@addfox/utils` with Shadow DOM
+
+## Resources
+
+- Addfox docs: https://addfox.dev
+- Rsbuild Svelte plugin: https://rsbuild.dev/plugins/list/plugin-svelte
+- Svelte docs: https://svelte.dev

package/templates/template-svelte-ts/AGENTS.md

@@ -0,0 +1,61 @@
+# AI Agent Guide - Svelte Addfox Extension
+
+> **Priority**: Follow `.agents/skills/` first, then this guide, then [official docs](https://addfox.dev)
+
+## Project Overview
+
+Svelte browser extension using Addfox build tool. Uses `@rsbuild/plugin-svelte` for Svelte support.
+
+## Key Configuration Fields (addfox.config.ts)
+
+### Required Fields
+
+- **`manifest`** - Extension manifest.json content
+  - Supports `chromium` and `firefox` variants
+  - Addfox auto-injects entry paths
+
+- **`plugins`** - Rsbuild plugins array
+  - Must include `pluginSvelte()` for Svelte support
+
+### Optional Fields (use when needed)
+
+- **`appDir`** - Source directory (default: "app")
+- **`outDir`** - Build output directory
+- **`entry`** - Manual entry mapping
+- **`hotReload`** - Dev server settings
+- **`debug`** - Enable debug logging
+- **`zip`** - Output zip configuration
+- **`rsbuild`** - Override Rsbuild configuration
+
+## Entry Structure
+
+Entries auto-discovered from `appDir` subdirectories:
+
+- `app/background/` → Service Worker (index.ts)
+- `app/content/` → Content Script (index.ts)
+- `app/popup/` → Popup page (index.ts + App.svelte)
+- `app/options/` → Options page
+- `app/sidepanel/` → Side panel
+
+## Framework-Specific Notes
+
+### Svelte
+
+- Single File Components (`.svelte` files)
+- TypeScript support in `<script lang="ts">`
+- Reactive statements with `$:`
+
+### Browser Extension APIs
+
+- Install `webextension-polyfill` for cross-browser compatibility
+
+### Styling
+
+- Svelte scoped styles by default
+- Content scripts: use `@addfox/utils` with Shadow DOM
+
+## Resources
+
+- Addfox docs: https://addfox.dev
+- Rsbuild Svelte plugin: https://rsbuild.dev/plugins/list/plugin-svelte
+- Svelte docs: https://svelte.dev

package/templates/template-vanilla-js/AGENTS.md

@@ -0,0 +1,52 @@
+# AI Agent Guide - Vanilla Addfox Extension
+
+> **Priority**: Follow `.agents/skills/` first, then this guide, then [official docs](https://addfox.dev)
+
+## Project Overview
+
+Vanilla JavaScript browser extension using Addfox build tool. No framework plugins needed.
+
+## Key Configuration Fields (addfox.config.js)
+
+### Required Fields
+
+- **`manifest`** - Extension manifest.json content
+  - Supports `chromium` and `firefox` variants
+  - Addfox auto-injects entry paths
+
+### Optional Fields (use when needed)
+
+- **`appDir`** - Source directory (default: "app")
+- **`outDir`** - Build output directory
+- **`entry`** - Manual entry mapping
+- **`hotReload`** - Dev server settings
+- **`debug`** - Enable debug logging
+- **`zip`** - Output zip configuration
+- **`rsbuild`** - Override Rsbuild configuration
+- **`plugins`** - Add Rsbuild plugins if needed
+
+## Entry Structure
+
+Entries auto-discovered from `appDir` subdirectories. Each needs `index.js` as entry.
+
+## Notes
+
+### JavaScript
+
+- Pure JavaScript without framework
+- DOM APIs available directly
+
+### Browser Extension APIs
+
+- Install `webextension-polyfill` for cross-browser compatibility
+- Or use `chrome.*` APIs directly
+
+### Styling
+
+- Plain CSS
+- Content scripts: use `@addfox/utils` with Shadow DOM
+
+## Resources
+
+- Addfox docs: https://addfox.dev
+- WebExtension API: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API

package/templates/template-vanilla-ts/AGENTS.md

@@ -0,0 +1,59 @@
+# AI Agent Guide - Vanilla Addfox Extension
+
+> **Priority**: Follow `.agents/skills/` first, then this guide, then [official docs](https://addfox.dev)
+
+## Project Overview
+
+Vanilla TypeScript browser extension using Addfox build tool. No framework plugins needed.
+
+## Key Configuration Fields (addfox.config.ts)
+
+### Required Fields
+
+- **`manifest`** - Extension manifest.json content
+  - Supports `chromium` and `firefox` variants
+  - Addfox auto-injects entry paths
+
+### Optional Fields (use when needed)
+
+- **`appDir`** - Source directory (default: "app")
+- **`outDir`** - Build output directory
+- **`entry`** - Manual entry mapping
+- **`hotReload`** - Dev server settings
+- **`debug`** - Enable debug logging
+- **`zip`** - Output zip configuration
+- **`rsbuild`** - Override Rsbuild configuration
+- **`plugins`** - Add Rsbuild plugins if needed (no framework plugin required)
+
+## Entry Structure
+
+Entries auto-discovered from `appDir` subdirectories:
+
+- `app/background/` → Service Worker (index.ts)
+- `app/content/` → Content Script (index.ts)
+- `app/popup/` → Popup page (index.ts + HTML)
+- `app/options/` → Options page
+- `app/sidepanel/` → Side panel
+
+## Notes
+
+### TypeScript
+
+- Pure TypeScript without framework
+- DOM APIs available directly
+- No JSX transform needed
+
+### Browser Extension APIs
+
+- Install `webextension-polyfill` for cross-browser compatibility
+- Or use `chrome.*` APIs directly
+
+### Styling
+
+- Plain CSS or CSS Modules
+- Content scripts: use `@addfox/utils` with Shadow DOM
+
+## Resources
+
+- Addfox docs: https://addfox.dev
+- WebExtension API: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API

package/templates/template-vue-js/AGENTS.md

@@ -0,0 +1,60 @@
+# AI Agent Guide - Vue Addfox Extension
+
+> **Priority**: Follow `.agents/skills/` first, then this guide, then [official docs](https://addfox.dev)
+
+## Project Overview
+
+Vue 3 browser extension using Addfox build tool. Uses `@rsbuild/plugin-vue` for SFC support.
+
+## Key Configuration Fields (addfox.config.js)
+
+### Required Fields
+
+- **`manifest`** - Extension manifest.json content
+  - Supports `chromium` and `firefox` variants
+  - Addfox auto-injects entry paths
+
+- **`plugins`** - Rsbuild plugins array
+  - Must include `pluginVue()` for Vue SFC support
+
+### Optional Fields (use when needed)
+
+- **`appDir`** - Source directory (default: "app")
+- **`outDir`** - Build output directory
+- **`entry`** - Manual entry mapping
+- **`hotReload`** - Dev server settings
+- **`debug`** - Enable debug logging
+- **`zip`** - Output zip configuration
+- **`rsbuild`** - Override Rsbuild configuration
+
+## Entry Structure
+
+Entries auto-discovered from `appDir` subdirectories:
+
+- `app/background/` → Service Worker (index.js)
+- `app/content/` → Content Script (index.js)
+- `app/popup/` → Popup page (index.js + App.vue)
+- `app/options/` → Options page
+- `app/sidepanel/` → Side panel
+
+## Framework-Specific Notes
+
+### Vue 3
+
+- Uses Vue 3 Composition API
+- Single File Components (`.vue` files)
+
+### Browser Extension APIs
+
+- Install `webextension-polyfill` for cross-browser compatibility
+
+### Styling
+
+- Vue scoped styles supported
+- Content scripts: use `@addfox/utils` with Shadow DOM
+
+## Resources
+
+- Addfox docs: https://addfox.dev
+- Rsbuild Vue plugin: https://rsbuild.dev/plugins/list/plugin-vue
+- Vue 3 docs: https://vuejs.org

package/templates/template-vue-ts/AGENTS.md

@@ -0,0 +1,65 @@
+# AI Agent Guide - Vue Addfox Extension
+
+> **Priority**: Follow `.agents/skills/` first, then this guide, then [official docs](https://addfox.dev)
+
+## Project Overview
+
+Vue 3 browser extension using Addfox build tool. Uses `@rsbuild/plugin-vue` for SFC support.
+
+## Key Configuration Fields (addfox.config.ts)
+
+### Required Fields
+
+- **`manifest`** - Extension manifest.json content
+  - Supports `chromium` and `firefox` variants
+  - Addfox auto-injects entry paths
+
+- **`plugins`** - Rsbuild plugins array
+  - Must include `pluginVue()` for Vue SFC support
+
+### Optional Fields (use when needed)
+
+- **`appDir`** - Source directory (default: "app")
+- **`outDir`** - Build output directory (default: ".addfox/extension")
+- **`entry`** - Manual entry mapping (when auto-discovery fails)
+- **`hotReload`** - Dev server settings
+- **`debug`** - Enable debug logging
+- **`zip`** - Output zip configuration
+- **`rsbuild`** - Override Rsbuild configuration
+
+## Entry Structure
+
+Entries auto-discovered from `appDir` subdirectories:
+
+- `app/background/` → Service Worker (index.ts)
+- `app/content/` → Content Script (index.ts)
+- `app/popup/` → Popup page (index.ts + App.vue)
+- `app/options/` → Options page
+- `app/sidepanel/` → Side panel
+- `app/devtools/` → DevTools page
+
+## Framework-Specific Notes
+
+### Vue 3
+
+- Uses Vue 3 Composition API
+- Single File Components (`.vue` files)
+- TypeScript support enabled
+
+### Browser Extension APIs
+
+- Install `webextension-polyfill` for cross-browser compatibility
+- Use in setup scripts or component methods
+
+### Styling
+
+- Vue scoped styles supported
+- CSS Modules available
+- Content scripts: use `@addfox/utils` with Shadow DOM
+
+## Resources
+
+- Addfox docs: https://addfox.dev
+- Rsbuild Vue plugin: https://rsbuild.dev/plugins/list/plugin-vue
+- Vue 3 docs: https://vuejs.org
+- WebExtension API: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API