Kategorien
Projekte Webentwicklung

Astro, Netlify und falsche Annahmen

Gestern habe ich endlich herausgefunden, warum Netlify in meinem Preview-Build keine Bilder in bestimmten Seiten anzeigt. In meinem Fall war das eine Gallery, die einen Ordner übergeben bekommt.

Danach habe ich alle Bilder, die in Astro gefunden werden über diesen Filter gejagt. Lokal und im statischen Build war alles wunderbar.

Erster Gedanke war, dass bei Netlify die Bilder-Ausgabe einen Timeout hat, da ich am Anfang noch recht große Bilder verwendet habe. Allerdings hat der Resize der Bilder nichts bewirkt. Das war’s dann nicht.

Dann war die nächste Vermutung es läge an der fehlenden Netlify Integration, aber die ist für den static Build völlig unerheblich, wichtig ist die hauptsächlich für den Betrieb einer SSR Anwendung. Das Image-CDN und die Bearbeitung der Bilder ist davon (im static Build) nicht betroffen.

Am Ende habe ich in meiner Verzweiflung angefangen, in der Anwendung an verschiedenen Stellen zu debuggen, unter anderem an dem Mechanismus, mit dem ich die Bilder zusammensuche. Tatsächlich war das nur als Übergang gedacht, da ich damit ja den Bildern auch keine alt-Texte und Co. übergeben konnte, aber die Galeriemodule funktional schon mal testen konnte.

Spannenderweise hat die obige Debug-Ausgabe lokal das erwartete Ergebnis gezeigt.

Im Netlify-Build-Log war allerdings trotz gefundenen Images das filteredImages-Log leer, bzw. ein leeres Array:

Und wie man sieht: Netlify findet Bilder scheinbar nur – in schon bearbeiteter Form – in dem _astro-Ordner, wenn die Components gebaut werden. Blöd, aber genau der Grund, warum der Filter nicht funktioniert und damit keine Bilder zurückgegeben werden. Leider unterscheided sich das von der Lokalen Bauweise, wo die Bilder noch in den korrekten Ordnern liegen.

Verlinkt man die Bilder normal, z.B. aus der Content-Collection, dann geht natürlich alles korrekt und auch der Preview Build bei Netlify funktioniert korrekt. Jetzt sogar schon mit Alt-Texten, zumindest bei den Contents, in denen ich das ganze schon gepflegt habe. Wird der nächste Schritt mit SEO-und Accessibility-Screening halt schon etwas schneller möglich.

Kategorien
Wochenbericht

Wochenbericht 2023.03

Ein verspätetes “Frohes Neues”. Das Jahr fing aus privaten Gründen schon mal spannend an, mal schauen wie die Schlagzahl hier dieses Jahr funktioniert.

  1. Freebie: Atlas Icons mit > 2300 Icons unter MIT Lizenz
  2. How to animate an element’s height with CSS grid – Sehr geiler Trick der auch mit Tailwind gut funktioniert – arbitrary values sei Dank.
  3. Bitwarden schluckt Open-Source-Start-up Passwordless.dev
  4. Endpunkte-Doku bei Astro
  5. Ureinwohner bitten Apache Foundation um Namenswechsel