{"library":"rollup-plugin-chrome-extension","title":"Rollup Plugin for Chrome Extensions","description":"rollup-plugin-chrome-extension (RPCE) is a Rollup plugin designed to simplify the development and bundling of Chrome Extensions. It functions by using the `manifest.json` file as its primary input, automatically processing and bundling all declared assets into the output directory. As of version 3.6.15, the plugin is actively maintained within the `crxjs` monorepo, which also includes a `vite-plugin-chrome-extension`. RPCE provides crucial features like Hot Module Replacement (HMR) for a rapid development cycle, seamless integration with Manifest V3, and automatic handling of web-accessible resources. Its key differentiators include the manifest-first configuration approach, which abstracts away complex build setups, and its ability to bring modern bundler features to the extension development environment. It receives regular updates, mostly patch releases, and provides boilerplates for popular frameworks like React and Svelte.","language":"javascript","status":"active","last_verified":"Sun Apr 19","install":{"commands":["npm install rollup-plugin-chrome-extension"],"cli":null},"imports":["import chromeExtension from 'rollup-plugin-chrome-extension'","import { defineManifest } from '@crxjs/vite-plugin'","import type * as ChromeExtensionTypes from 'rollup-plugin-chrome-extension'"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import { defineConfig } from 'rollup';\nimport { resolve } from 'path';\nimport chromeExtension from 'rollup-plugin-chrome-extension';\nimport manifest from './manifest.json';\nimport commonjs from '@rollup/plugin-commonjs';\nimport { nodeResolve } from '@rollup/plugin-node-resolve';\nimport typescript from '@rollup/plugin-typescript';\n\nexport default defineConfig({\n  input: 'src/index.ts', // or your main entry point\n  output: {\n    dir: 'dist',\n    format: 'esm', // Manifest V3 and Rollup multi-file inputs generally prefer ESM\n    chunkFileNames: 'chunks/[name]-[hash].js',\n    entryFileNames: '[name].js',\n    assetFileNames: '[name].[ext]'\n  },\n  plugins: [\n    chromeExtension({\n      manifest: { ...manifest, name: manifest.name + (process.env.NODE_ENV === 'development' ? ' Dev' : '') },\n    }),\n    nodeResolve(),\n    commonjs(),\n    typescript(),\n  ],\n  // Ensure manifest.json is part of the bundle process\n  watch: {\n    include: ['manifest.json', 'src/**']\n  }\n});","lang":"typescript","description":"This quickstart demonstrates a basic `rollup.config.ts` setup for building a Chrome Extension using `rollup-plugin-chrome-extension`. It imports the plugin, uses a `manifest.json` as input, and includes common Rollup plugins for TypeScript, CommonJS, and Node module resolution. The `output.format` is set to ESM, which is recommended for Manifest V3 extensions.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}