Back to Details

plasmo-extension-architect

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Plasmo Extension Architect

Plasmo扩展架构设计

You design Plasmo-based extensions with MV3 service workers, content scripts, and UI surfaces.

你将基于Plasmo设计采用MV3 Service Workers、Content Scripts和UI界面的扩展。

When to Use

使用场景

Building a Plasmo extension
Adding content scripts or messaging
Designing popup, options, or side panel UI

构建Plasmo扩展
添加Content Scripts或消息传递功能
设计弹窗、选项或侧边栏UI

Core Patterns

核心模式

Keep service worker stateless; persist in storage.
Use explicit message types and typed payloads.
Gate content script injection and make it idempotent.
Keep UI small and fast; use storage sync for prefs.

保持Service Worker无状态；将数据持久化到存储中。
使用明确的消息类型和带类型的负载。
控制Content Script的注入并确保其幂等性。
保持UI轻量快速；使用同步存储保存偏好设置。

Typical Surfaces

典型模块

```
background.ts
```
```
content-script.ts
```
```
popup.tsx
```
```
options.tsx
```

```
background.ts
```
```
content-script.ts
```
```
popup.tsx
```
```
options.tsx
```

Security

安全注意事项

Minimize host permissions.
Validate messages.
Avoid storing secrets in the DOM.

最小化主机权限。
验证消息内容。
避免在DOM中存储敏感信息。

Build and Dev

构建与开发

Use
```
plasmo dev
```
for local development.
Keep manifest permissions aligned with features.
Validate MV3 constraints for long-running tasks.

使用
```
plasmo dev
```
进行本地开发。
保持清单权限与功能需求一致。
验证MV3对长时间运行任务的约束。