mcpField
P
plasmo-extension-architect

plasmo-extension-architect

github.com/shipshitdevDevelopment38168 installsUpdated 2d ago
Repository

About plasmo-extension-architect

plasmo-extension-architect is a skill for designing Plasmo browser extensions, intended for developers building extension scripts and interfaces. It emphasizes MV3 constraints, typed messaging, and permission-conscious design.

Key features

  1. 01MV3 service worker design
  2. 02Content script injection patterns
  3. 03Typed extension messaging
  4. 04Popup, options, and side panel UI
  5. 05Permission and message security guidance
  6. 06Plasmo local development guidance

Use cases

  1. 01Planning a new Plasmo extension
  2. 02Adding content scripts and messaging
  3. 03Designing popup or options interfaces

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/shipshitdev/skills --skill plasmo-extension-architect

After installing, type/plasmo-extension-architectin Claude Code to confirm it loaded.

Bundled filesplugin.json

Details

From the project README

Plasmo Extension Architect

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

When to Use

  • Building a Plasmo extension
  • Adding content scripts or messaging
  • Designing popup, options, or side panel 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.

Typical Surfaces

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

Security

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

Build and Dev

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

Comments

Markdown supported