#Get started immediately

Build and run working browser extensions in minutes. This guide gives you the fastest path to start from real-world samples with Extension.js.

#Run Chrome extension samples fast

Use samples from the Chrome Extension Samples repository to validate your setup and learn the workflow quickly.

#Steps

1. Open your terminal.
2. Move to the directory where you want the project.
3. Run:

npx extension@latest dev <sample-name>

pnpx extension@latest dev <sample-name>

yarn dlx extension@latest dev <sample-name>

Replace <sample-name> with any sample from Chrome Extension Samples.

#Example

This example uses page-redder.

#Run samples in Microsoft Edge

Extension.js supports Microsoft Edge out of the box.

#Steps

1. Open your terminal.
2. Move to the directory where you want the project.
3. Run:

npx extension@latest dev <sample-name> --browser=edge

pnpx extension@latest dev <sample-name> --browser=edge

yarn dlx extension@latest dev <sample-name> --browser=edge

Replace <sample-name> with the sample you want to run.

#Example

This example runs magic8ball in Edge.

#Run Mozilla add-ons in Edge with polyfill

You can also run Mozilla add-ons in Edge by enabling the polyfill.

#Steps

1. Navigate to your project directory.
2. Run:

npx extension@latest dev <addon-name> --browser=edge --polyfill=true

pnpx extension@latest dev <addon-name> --browser=edge --polyfill=true

yarn dlx extension@latest dev <addon-name> --browser=edge --polyfill=true

This fetches a Mozilla add-on and adapts it for Edge.

#Example

This example fetches Apply CSS from MDN WebExtensions Examples and runs it in Edge.

#Quick tips

• Use TypeScript: add a tsconfig.json file to your project root.
• Use React: add react and react-dom to your package.json.
• A tsconfig.json configured for React enables TypeScript + React authoring.
• If you need to handle assets not declared in the manifest, learn more about Special Folders.

#Best practices

• Use the extension package to build, run, and bundle your extension from one toolchain.
• Use --browser to target a specific browser while developing.
• Use --polyfill when adapting Mozilla add-ons for Edge compatibility.

#Next steps

• Continue with create your first extension.
• Explore starter templates for your preferred stack.
• Review dev command options to target specific browsers and binaries.