🔥 Get Started Immediately#

Welcome to the fast track for developing cross-browser extensions with Extension.js. Whether you’re quickly prototyping or working on full-scale development, this guide will help you get started right away.

Kickstart Any Sample from Chrome Extension Samples#

Start development by using a sample from the Chrome Extension Samples repository. It's a great way to learn best practices and save time.

1. Open your terminal.
2. Navigate to the directory where you want to create your project.
3. Run the following command:

npx extension@latest dev <sample-name>

Note: Replace <sample-name> with the sample you want to use from Chrome Extension Samples.

See the example below, where we request the page-redder sample from Google Chrome Extension Samples.

Use Microsoft Edge to Kickstart Any Sample#

Extension.js supports a variety of browsers, including Microsoft Edge. To start an Edge-compatible extension, follow these steps:

1. Open your terminal.
2. Navigate to the directory where you want to create your project.
3. Run this command:

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

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

In the example below, we request the magic8ball sample from Google Chrome Extension Samples using Edge as the target browser.

Run Mozilla Add-Ons Using Edge#

You can also adapt Mozilla Add-Ons to run on Edge:

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

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

This will fetch a Mozilla Add-On and adapt it for Edge.

Below is an example of fetching the Apply CSS sample from MDN WebExtensions Examples and running it on Edge.

Tips to Get Started#

• To use TypeScript, add a tsconfig.json file to the root of your project.
• To use React, add React as a dependency in your package.json.
• Any tsconfig.json with React support will make your project ready for React and TypeScript.
• If you need to handle assets not declared in the manifest, learn more about Special Folders.

Next Steps#

Start exploring browser extension development with Extension.js by creating your first extension.