Instalación y configuración

Puedes instalar Alpine.js mediante CDN o npm. Para comenzar rápidamente, agrega el siguiente script a tu HTML:

<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>

Esto cargará Alpine.js directamente desde un CDN. Coloca la etiqueta <script> antes del cierre de </body> en tu archivo HTML.

npm install alpinejs

Luego, importa Alpine.js en tu archivo JavaScript principal:

import Alpine from 'alpinejs';
window.Alpine = Alpine;
Alpine.start();

<div x-data="{ open: false }">
<button @click="open = !open">Mostrar/Ocultar</button>
<div x-show="open">
  ¡Hola desde Alpine.js!
</div>
</div>

🐝