Repolode
Enviar
PlasmoHQ

PlasmoHQ/plasmo

Framework de extensões de navegador para React e TypeScript que configura manifest, build e recarregamento ao vivo para Chrome, Firefox e Edge.

Ver no GitHubSite
Estrelas
13,168
Forks
465
Issues abertas
371
Último commit
há 17 horas

O que é?

Plasmo é um framework para criar extensões de navegador, inspirado no Next.js. Ele elimina boa parte da configuração manual normalmente necessária no desenvolvimento de extensões, permitindo que os desenvolvedores se concentrem em páginas de popup, páginas de opções, content scripts e service workers em segundo plano.

O framework oferece suporte a React e TypeScript desde o início, além de suporte opcional a Svelte e Vue. Ele oferece recarregamento ao vivo com React HMR, arquivos de ambiente, uma API de armazenamento e uma API de mensagens entre componentes da extensão. Os content scripts podem renderizar a interface diretamente nas páginas hospedeiras, e o projeto inclui bundling de código remoto para casos como o carregamento do Google Analytics.

Plasmo pode gerar extensões para várias combinações de navegadores e manifests a partir de uma única base de código e inclui publicação automatizada nas lojas por meio do Browser Platform Publisher. Ele funciona em macOS, Windows e Linux com Node.js 16 ou posterior, e o projeto se descreve como software em fase alpha.

Recursos principais

  • 01Suporte a React e TypeScript, com Svelte e Vue opcionais
  • 02Recarregamento ao vivo com React HMR durante o desenvolvimento
  • 03APIs de armazenamento e mensagens para comunicação entre partes da extensão
  • 04Interface de content scripts renderizada nas páginas hospedeiras
  • 05Builds para vários navegadores e manifests a partir de uma única base de código
  • 06Publicação automatizada por meio do Browser Platform Publisher

Casos de uso

  • Criar uma extensão para Chrome ou Firefox com React e TypeScript sem configurar o manifest manualmente
  • Injetar interfaces baseadas em React em sites de terceiros por meio de content scripts
  • Distribuir uma única base de código de extensão para vários navegadores e lojas

Início rápido

  1. 1

    Verifique se o Node.js 16.x ou posterior está instalado

  2. 2

    Instale o pnpm (altamente recomendado)

  3. 3

    Crie um novo projeto a partir do template

    pnpm create plasmo example-dir
  4. 4

    Acesse o diretório do projeto e inicie o servidor de desenvolvimento

    cd example-dir pnpm dev

Antes de usar

  • O README informa que o Plasmo é um software alfa, então pode haver mudanças entre versões.
  • Alguns recursos dependem de serviços externos, como a oferta de nuvem do Itero, que é opcional.

Tópicos

#browser-extension#react#typescript#chrome-extension#firefox-addon#bundler#frontend-framework#edge-addon#parcel#reactjs

Perguntas frequentes

O que é plasmo?
Framework de extensões de navegador para React e TypeScript que configura manifest, build e recarregamento ao vivo para Chrome, Firefox e Edge. Plasmo é um framework para criar extensões de navegador, inspirado no Next.js. Ele elimina boa parte da configuração manual normalmente necessária no desenvolvimento de extensões, permitindo que os desenvolvedores se concentrem em páginas de popup, páginas de opções, content scripts e service workers em segundo plano.
plasmo é gratuito? Qual é a licença?
plasmo é open source sob a licença MIT. Confira os termos da licença antes de usá-lo em produtos comerciais.
plasmo ainda é mantido?
Manutenção ativa. O último commit de plasmo foi em 21 de out. de 2026.
Para que posso usar plasmo?
Criar uma extensão para Chrome ou Firefox com React e TypeScript sem configurar o manifest manualmente Injetar interfaces baseadas em React em sites de terceiros por meio de content scripts Distribuir uma única base de código de extensão para vários navegadores e lojas
Como instalar plasmo?
Verifique se o Node.js 16.x ou posterior está instalado Instale o pnpm (altamente recomendado) Crie um novo projeto a partir do template: pnpm create plasmo example-dir Acesse o diretório do projeto e inicie o servidor de desenvolvimento: cd example-dir pnpm dev
Onde consigo plasmo?
O código-fonte e as instruções de instalação estão no GitHub: https://github.com/PlasmoHQ/plasmo

Resumo gerado por IA a partir do README do projeto. As estatísticas do GitHub são atualizadas diariamente.

Projetos relacionados