> ## 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 瀏覽器擴充功能範本

> 建立完整支援 Manifest V3 的 React 瀏覽器擴充功能，內含 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>

## 你會獲得什麼

以元件為核心的 UI 起點，完整相容 Manifest V3（MV3）。Popup、options 與 content script 以 React 進入點出貨，並已串接好 hot module replacement（HMR）。修改元件後就能直接看到更新，不需手動重新載入擴充功能。

對已熟悉 React 的團隊來說，這是最常見的起點。

## 原始碼

在 GitHub 瀏覽完整原始碼：[extension-js/examples/react](https://github.com/extension-js/examples/tree/main/examples/react)。
