Repolode
Submit
PlasmoHQ

PlasmoHQ/plasmo

A browser extension framework for React and TypeScript that handles manifest, build and live-reload setup for Chrome, Firefox and Edge.

View on GitHubWebsite
Stars
13,168
Forks
465
Open issues
371
Last commit
16 hours ago

What is it?

Plasmo is a framework for building browser extensions, inspired by Next.js. It removes much of the manual configuration that extension development normally requires, so developers can focus on popup pages, options pages, content scripts and background service workers.

The framework supports React and TypeScript out of the box, with optional Svelte and Vue support. It provides live reloading with React HMR, environment files, a storage API and a messaging API between extension components. Content scripts can render UI directly into host pages, and the project includes remote code bundling for cases such as loading Google Analytics.

Plasmo can target multiple browser and manifest combinations from one codebase and includes automated store deployment through the Browser Platform Publisher. It runs on macOS, Windows and Linux with Node.js 16 or later, and the project describes itself as alpha software.

Key features

  • 01React and TypeScript support with optional Svelte and Vue
  • 02Live reloading with React HMR during development
  • 03Storage and messaging APIs for communication between extension parts
  • 04Content script UI rendered into host pages
  • 05Builds for multiple browser and manifest targets from one codebase
  • 06Automated deployment via Browser Platform Publisher

Use cases

  • Building a Chrome or Firefox extension with React and TypeScript without writing manifest configuration by hand
  • Injecting React-based UI into third-party websites via content scripts
  • Shipping one extension codebase to multiple browsers and stores

Quick start

  1. 1

    Check that Node.js 16.x or later is installed

  2. 2

    Install pnpm (strongly recommended)

  3. 3

    Create a new project from the template

    pnpm create plasmo example-dir
  4. 4

    Enter the project directory and start the dev server

    cd example-dir pnpm dev

Things to know

  • The README states Plasmo is alpha software, so things may change between versions.
  • Some features depend on external services such as the Itero cloud offering, which is optional.

Topics

#browser-extension#react#typescript#chrome-extension#firefox-addon#bundler#frontend-framework#edge-addon#parcel#reactjs

FAQ

What is plasmo?
A browser extension framework for React and TypeScript that handles manifest, build and live-reload setup for Chrome, Firefox and Edge. Plasmo is a framework for building browser extensions, inspired by Next.js. It removes much of the manual configuration that extension development normally requires, so developers can focus on popup pages, options pages, content scripts and background service workers.
Is plasmo free to use? What license does it have?
plasmo is open source under the MIT license. Check the license terms before using it in commercial products.
Is plasmo still maintained?
Actively maintained. The last commit to plasmo was on Oct 21, 2026.
What can I use plasmo for?
Building a Chrome or Firefox extension with React and TypeScript without writing manifest configuration by hand Injecting React-based UI into third-party websites via content scripts Shipping one extension codebase to multiple browsers and stores
How do I install plasmo?
Check that Node.js 16.x or later is installed Install pnpm (strongly recommended) Create a new project from the template: pnpm create plasmo example-dir Enter the project directory and start the dev server: cd example-dir pnpm dev
Where can I get plasmo?
The source code and installation instructions are on GitHub: https://github.com/PlasmoHQ/plasmo

Summary generated by AI from the project's README. GitHub stats refresh daily.

Related projects