English | 简体中文 | Tiếng Việt | Deutsch | French | Indonesian | Русский | Turkish | 日本語 | 한국어
云服务: 我们为浏览器扩展程序构建了一个云服务，叫 Itero 。如果你想要进行即时beta测试并体验更多很棒的功能，可以去尝试一下。
Plasmo 框架是一款黑客为黑客打造的功能强大的浏览器扩展程序软件开发工具包（SDK）。使用 Plasmo 来构建你的浏览器扩展程序，不需要操心扩展的配置文件和构建时的一些奇怪特性。
它就像浏览器扩展界的 Next.js ！
- 一流的 React + Typescript 支持
- 声明式开发（自动生成 manifest.json）
- 将UI组件渲染到网页
- 扩展内置页面
- 扩展热重载 + React 模块热更新
.env*文件- 扩展储存 API
- 扩展通信 API
- 远程代码打包 (例如 Google Analytics)
- 支持多个浏览器和manifest版本
- 通过BPP进行自动部署
- 可选 Svelte 或 Vue 进行开发
还有更多的功能！🚀
- Node.js 16.x 及以上
- MacOS，Windows，或 Linux
- (强烈推荐) pnpm
我们有一些展示如何集成 Firebase Authentication, Redux, Supabase authentication, Tailwind 以及更多技术的代码示例。如果想要浏览全部代码示例，请访问示例仓库。
阅读 文档 以更深入地了解 Plasmo 框架。
为了更深入了解浏览器扩展工作原理和开发方法，我们强烈推荐 Matt Frisbie 的新书 "Building Browser Extensions"。
pnpm create plasmo example-dir
cd example-dir
pnpm dev
注意
- Popup 页面改动应在
popup.tsx - Options 页面改动应在
options.tsx - Content script 改动应在
content.ts - Background service worker 改动应在
background.ts
您还可以在它们各自的目录中组织这些文件：
ext-dir
├───assets
| └───icon.png
├───popup
| ├───index.tsx
| └───button.tsx
├───options
| ├───index.tsx
| ├───utils.ts
| └───input.tsx
├───contents
| ├───site-one.ts
| ├───site-two.ts
| └───site-three.ts
...
此外，您也能够将代码放到 src 子目录，而不将它们放到根目录，请参阅该指南。注意 assets 和其他配置文件仍须在根目录下。
要查看支持的浏览器列表，请参考我们此处的文档.
可以在 Discord 找到 Plasmo 社区。这是获得 Plasmo 框架使用帮助的恰当渠道。
我们的 行为守则 适用于所有 Plasmo 社区频道。
请参阅 贡献指南 以了解更多内容。
非常感谢所有的 贡献者 ❤️
欢迎发送PR加入我们的行列！
Plasmo 当前仍为 alpha 软件，且不同版本间可能存在修改，所以在使用过程中请留意，风险自负。