Content script example built with TypeScript. Mounts a small UI and uses typed modules.

What you'll see: A small UI injected into any web page, isolated in a Shadow DOM so site styles don't bleed through.

How it works: A content script mounts a TypeScript UI inside a Shadow DOM and applies scoped styles so the host page can't bleed through.

npx extension@latest create my-content-typescript --template content-typescript
cd my-content-typescript
npm install
npm run dev

A fresh browser window opens with the extension already loaded.

src/
├── content/
│   ├── scripts.ts
│   └── styles.css
├── images/
│   └── icon.png
├── background.ts
└── manifest.json

Run the extension in development mode. Target a browser with --browser:

npm run dev                 # Chromium (default)
npm run dev -- --browser=chrome
npm run dev -- --browser=edge
npm run dev -- --browser=firefox

Build for production. Convenience scripts cover each browser:

npm run build           # Chrome (default)
npm run build:firefox
npm run build:edge

Preview the production build with the bundled browser:

npm run preview

This template ships an end-to-end check (template.spec.ts) validated by the examples-repo CI on every commit.

• Extension.js docs
• Templates index
• GitHub: extension-js/extension.js