convert-web-pages-to-browser-extensions
Convert Web Pages to Browser Extensions
Use this skill to transform an existing frontend page into an extension entry with minimal behavior changes.
When to Use
- User asks to convert a webpage/project into an extension page
- User wants one UI reused for
popup,options,sidepanel,devtools, ornewtab - User asks for browser override pages such as bookmarks/history/newtab
- User has an existing
index.htmland wants it to become an extension entry - User needs custom extension entries with explicit HTML files
Scope
This skill focuses on entry conversion and wiring:
- Keep UI behavior as-is where possible
- Move or wrap page code into extension entry structure
- Ensure an HTML entry exists for page-like entries
More from addfox/skills
addfox-best-practices
Best practices for building browser extensions with the Addfox framework. Use when developing extensions with Addfox, configuring manifest/entry/permissions, or when discussing MV3, cross-browser support, framework/styling choices, messaging, and content UI injection.
21addfox-debugging
Debug Addfox build and runtime issues, including terminal failures, manifest errors, extension loading issues, and context messaging problems.
18extension-functions-best-practices
Best practices for implementing browser extension features across 13 categories. Reference this skill when developing video, audio, image, translation, download, userscript, AI (including Chrome built-in AI / Gemini Nano), ad-blocker, theme, email, game, password manager, or Web3 wallet features.
18addfox-testing
Test Addfox extensions with Rstest for unit/component tests and Playwright for end-to-end extension loading.
17migrate-to-addfox
Migrate existing browser extensions from WXT, Plasmo, Extension.js/CRXJS, or vanilla setups to Addfox with incremental validation.
5