{"id":15164,"library":"plasmo","title":"Plasmo Framework CLI","description":"The Plasmo Framework is a comprehensive Software Development Kit (SDK) designed for building browser extensions with a focus on developer experience, akin to Next.js for web applications. It abstracts away complex configuration, offering first-class support for React and TypeScript. Key features include declarative development, Content Scripts UI, Tab Pages, live-reloading with React HMR, environment file support, and built-in Storage and Messaging APIs. The framework simplifies targeting multiple browsers and manifest versions, and supports automated deployment via Browser Publish Protocol (BPP). It is currently in a stable state with version `0.90.5`, maintaining a rapid release cadence with frequent minor updates and patch fixes. Its differentiators lie in its 'batteries-included' approach, robust tooling, and focus on streamlining the extension development workflow.","status":"active","version":"0.90.5","language":"javascript","source_language":"en","source_url":"https://github.com/PlasmoHQ/plasmo","tags":["javascript","plasmo","browser-extensions","framework","typescript"],"install":[{"cmd":"npm install plasmo","lang":"bash","label":"npm"},{"cmd":"yarn add plasmo","lang":"bash","label":"yarn"},{"cmd":"pnpm add plasmo","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Strongly recommended package manager for consistent dependency management and faster installations within Plasmo projects.","package":"pnpm","optional":true}],"imports":[{"note":"Used in `manifest.ts` to programmatically define and configure the browser extension's manifest file.","symbol":"defineManifest","correct":"import { defineManifest } from 'plasmo'"},{"note":"Type definition for Content Script UI components, typically imported for type checking when creating React/TSX content script entrypoints.","symbol":"PlasmoCSUI","correct":"import type { PlasmoCSUI } from 'plasmo'"},{"note":"Type definition representing the structure of a Plasmo browser extension manifest, useful for ensuring type safety in `manifest.ts`.","symbol":"PlasmoExtensionManifest","correct":"import type { PlasmoExtensionManifest } from 'plasmo'"}],"quickstart":{"code":"npx plasmo init my-extension\ncd my-extension\npnpm install # Or npm install / yarn install\n\n# Start development server with live-reloading\nplasmo dev\n\n# Build for production, e.g., for Chrome, Manifest V3, and create a zip file\nplasmo build --target=chrome-mv3 --zip","lang":"bash","description":"Initializes a new Plasmo extension project, installs dependencies, and demonstrates how to start the development server and build for production."},"warnings":[{"fix":"Upgrade Plasmo to `v0.90.1` or later to ensure compatibility with React 19. Also, confirm `react` and `react-dom` versions are aligned with the Plasmo update.","message":"Plasmo versions prior to `v0.90.1` may not fully support React 19. Using newer React versions with older Plasmo releases could lead to build or runtime inconsistencies.","severity":"breaking","affected_versions":"<0.90.1"},{"fix":"Upgrade Plasmo to `v0.90.1` or later, as this release includes specific fixes for CSP and TrustedTypePolicy related issues.","message":"Content Security Policy (CSP) restrictions and `TrustedTypePolicy` creation could cause runtime errors, particularly affecting loading indicators in browser extensions built with Plasmo versions before `v0.90.1`.","severity":"gotcha","affected_versions":"<0.90.1"},{"fix":"Upgrade Plasmo to `v0.89.3` or later to resolve the blocking behavior associated with the version check.","message":"In Plasmo versions before `v0.89.3`, the framework's internal new version check mechanism could inadvertently block or significantly delay `plasmo dev` and `plasmo build` commands, hindering the development workflow.","severity":"gotcha","affected_versions":"<0.89.3"},{"fix":"Perform a clean install of node modules by deleting `node_modules` and your lock file (`pnpm-lock.yaml`, `package-lock.json`, or `yarn.lock`), then reinstalling dependencies with `pnpm install` (recommended) or `npm install`.","message":"Updates to native dependencies like `sharp` (e.g., in `v0.90.2`) can sometimes introduce platform-specific build failures. If you encounter build issues after a Plasmo update, especially on different operating systems, native module conflicts might be the cause.","severity":"gotcha","affected_versions":">=0.90.2"}],"env_vars":null,"last_verified":"2026-04-21T00:00:00.000Z","next_check":"2026-07-20T00:00:00.000Z","problems":[{"fix":"Upgrade Plasmo to `v0.90.5` or later, which includes improved error handling for ENOENT. Ensure all files referenced in your project exist at the correct paths.","cause":"A file system operation, often involving internal asset handling, failed because a required file or directory was not found.","error":"Error: ENOENT: no such file or directory, stat '<path>'"},{"fix":"Ensure your `manifest.ts` explicitly uses `export default defineManifest({ ... })` and that the object passed to `defineManifest` is well-formed.","cause":"The `manifest.ts` file is not correctly exporting a manifest object. This typically occurs if `defineManifest` is not used or if its return value is not a plain object.","error":"TypeError: `defineManifest` must return an object (Got type string)"},{"fix":"Upgrade Plasmo to `v0.90.1` or later, as this version includes specific bug fixes to address TrustedTypePolicy CSP compatibility issues. Review your extension's CSP if the issue persists on older Plasmo versions.","cause":"A Content Security Policy (CSP) restriction is preventing Plasmo's internal loading indicator from creating a necessary TrustedTypePolicy in the browser environment.","error":"Refused to create a Trusted Type policy because the name 'plasmo' is not a valid policy name. (Browser Console Error)"}],"ecosystem":"npm"}