Browser extensions ship with the worst dev experience in modern web. Manifest V3 fragmentation, browser-specific quirks, no hot reload for content scripts, and a separate build pipeline for every target. Extension.js fixes that.
Hot Module Replacement for popup, options, devtools and other extension pages, including React, Vue, Svelte, and Preact components, with targeted reloads for content scripts and the service worker so one save never reloads the whole extension
Manifest V3 by default, with automatic adapters for Chrome, Edge, Firefox, and Safari targets
One CLI for Chrome, Edge, Firefox, and any Chromium or Gecko binary
Zero config, no webpack, no rollup, no plugins to maintain
First-class TypeScript, React, Vue, Svelte, and Preact support
Production builds with extension build --zip, ready for the Chrome Web Store and Firefox Add-ons
Drop-in for existing extensions with one devDependency
Watch it work
How is this different
If you have used Plasmo, WXT, or CRXJS, here is what Extension.js does that the others do not:
Capability
Extension.js
Run any GitHub sample directly
extension dev https://github.com/.../sample
Managed browser binaries
extension install firefox downloads an isolated build
Targeted content-script reload across browsers
Built in, only the changed entries re-inject, no plugin glue
# Chrome (system default)
npx extension@latest dev --browser=chrome
# Edge
npx extension@latest dev --browser=edge
# Custom Chrome/Chromium path
npx extension@latest dev --chromium-binary "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
# Custom Firefox path
npx extension@latest dev --gecko-binary "/Applications/Firefox.app/Contents/MacOS/firefox"
Google Chrome ✅ Supported
Microsoft Edge ✅ Supported
Mozilla Firefox ✅ Supported
Apple Safari ✅ Supported
Chromium-based ✅ Supported
Gecko-based ✅ Supported
Ship to the store
Build a production-ready bundle and zip it for submission to the Chrome Web Store, Edge Add-ons, or Firefox AMO:
# Production build
npx extension@latest build
# Production build packaged as a ZIP
npx extension@latest build --zip
# Per-browser builds
npx extension@latest build --browser=firefox --zip
Useful flags:
--zip packages the build into a ZIP ready for store upload
--zip-source includes source files for store source-code review
--zip-filename <name> controls the output filename, written as dist/<name>-<browser>.zip
--out-dir <path> writes the build to <path>/<browser> instead of dist/<browser>. A build into the folder a live dev session serves is refused, so this is how a build runs beside a dev session
--polyfill enables the cross-browser webextension polyfill
Manage browser binaries
Skip the system-install dance. Extension.js can download and manage isolated browser binaries for clean dev sessions:
# Install a managed Firefox build
npx extension@latest install firefox
# Install Chrome and Edge in one go
npx extension@latest install --browser=all
# Print where managed browsers live
npx extension@latest install --where
Add to an existing extension
Install Extension.js as a dev dependency and wire up your scripts.
评论