> ## Documentation Index
> Fetch the complete documentation index at: https://extension.js.org/llms.txt
> Use this file to discover all available pages before exploring further.

# React 浏览器扩展模板

> 脚手架生成一个 React 浏览器扩展，提供完整的 Manifest V3 支持、JSX 以及可直接发布的 popup、options 和 content script 入口。

<img src="https://mintcdn.com/extensionjs/VCnDd7fX2Nza24SE/images/examples/new-react/screenshot.png?fit=max&auto=format&n=VCnDd7fX2Nza24SE&q=85&s=f117edc4f887e1571c03cdc4eeedebd3" alt="React template preview" className="w-full rounded-xl border border-black/10 dark:border-white/10" width="2400" height="1800" data-path="images/examples/new-react/screenshot.png" />

## 创建项目

<CodeGroup>
  ```bash npm theme={null}
  npx extension@latest create my-extension --template=react
  ```

  ```bash pnpm theme={null}
  pnpx extension@latest create my-extension --template=react
  ```

  ```bash yarn theme={null}
  yarn dlx extension@latest create my-extension --template=react
  ```

  ```bash bun theme={null}
  bunx extension@latest create my-extension --template=react
  ```

  ```bash bun theme={null}
  bunx extension@latest create my-extension --template=react
  ```
</CodeGroup>

## 你将得到什么

一个完全兼容 Manifest V3（MV3）的基于组件的 UI 基线。Popup、options 与 content script 都作为 React 入口提供，并接好了热模块替换（HMR）。编辑组件后即可看到更新，无需手动重新加载扩展。

对于已经熟悉 React 的团队来说，这是最常见的起点。

## 源代码

在 GitHub 上浏览完整源码：[extension-js/examples/react](https://github.com/extension-js/examples/tree/main/examples/react)。