alpinejs/alpine

O que é?

Recursos principais

• 01Estado declarativo e manipulação de eventos escritos diretamente com atributos HTML.
• 02Disponível como tag script de CDN ou módulo npm.
• 03Plugins oficiais para animações de recolhimento, foco, máscaras, persistência e morphing do DOM.
• 04Variante de build compatível com CSP para ambientes com políticas de segurança de conteúdo rigorosas.
• 05Monorepo com suítes de testes do Cypress e do Vitest.

Casos de uso

• Adicionar menus suspensos, modais ou abas a uma página renderizada no servidor, sem um framework SPA completo.
• Persistir o estado da interface, como painéis abertos ou valores de formulários, entre carregamentos de página.
• Criar formulários interativos com máscaras de entrada e gerenciamento de foco.
• Trabalhar em ambientes que exigem uma build JavaScript compatível com CSP.

Início rápido

1. 1

   Clone o repositório localmente

2. 2

   Instale as dependências

   npm install
3. 3

   Compile todos os pacotes

   npm run build
4. 4

   Inclua o arquivo cdn.js compilado em uma tag script na sua página

Antes de usar

• !Este repositório é destinado a contribuições; a maior parte da documentação de uso está no site externo de documentação do Alpine.

Tópicos

Perguntas frequentes

O que é alpine?

Um framework JavaScript enxuto e robusto para adicionar comportamento reativo diretamente à sua marcação HTML. Alpine.js é um framework JavaScript enxuto para criar interações diretamente no HTML. Os desenvolvedores associam estado e manipuladores de eventos aos elementos por meio de atributos. Assim, pequenas interações, como menus suspensos, modais, abas ou lógica de formulários, podem ficar junto à marcação que afetam, sem exigir uma estrutura de aplicação separada e pesada em etapas de build.

alpine é gratuito? Qual é a licença?

alpine é open source sob a licença MIT. Confira os termos da licença antes de usá-lo em produtos comerciais.

alpine ainda é mantido?

Manutenção ativa. O último commit de alpine foi em 16 de out. de 2026.

Para que posso usar alpine?

Adicionar menus suspensos, modais ou abas a uma página renderizada no servidor, sem um framework SPA completo. Persistir o estado da interface, como painéis abertos ou valores de formulários, entre carregamentos de página. Criar formulários interativos com máscaras de entrada e gerenciamento de foco. Trabalhar em ambientes que exigem uma build JavaScript compatível com CSP.

Como instalar alpine?

Clone o repositório localmente Instale as dependências: npm install Compile todos os pacotes: npm run build Inclua o arquivo cdn.js compilado em uma tag script na sua página

Onde consigo alpine?

O código-fonte e as instruções de instalação estão no GitHub: https://github.com/alpinejs/alpine