Poppo's Pizzeria
El reto principal
OWL Carousel y Lightbox son plugins de jQuery de la vieja escuela: esperan que jQuery ya exista como variable global y que el DOM esté listo cuando ellos se inicializan. Astro procesa y agrupa los scripts a su manera, así que el orden que dabas por sentado en un HTML plano deja de estar garantizado.
El carrusel arrancaba vacío de forma intermitente: el plugin se ejecutaba antes de que jQuery estuviera disponible, y el fallo dependía del orden de carga, así que en local casi nunca se reproducía. La solución fue cargar jQuery y los plugins con is:inline en el orden explícito que ellos esperan, e inicializarlos dentro de DOMContentLoaded en lugar de confiar en el momento de ejecución del bundle.
Qué aprendí
Meter una librería que asume globals dentro de un build moderno es siempre una negociación. Cuando la librería no se puede cambiar, la salida es sacarla del pipeline (is:inline) en vez de pelearse con el empaquetador.
- Un bug que solo aparece a veces suele ser un problema de orden de carga, no de lógica
-
is:inlinees la escotilla de escape de Astro cuando un script necesita control total - Los carruseles necesitan altura reservada o provocan un salto de layout al inicializarse
- Astro
- jQuery
- OWL Carousel
- Lightbox
- CSS