Fix 404s for AVIF sources when storePicturesInWEBP is enabled#264
Open
LorenzoGalassi wants to merge 1 commit into
Open
Fix 404s for AVIF sources when storePicturesInWEBP is enabled#264LorenzoGalassi wants to merge 1 commit into
LorenzoGalassi wants to merge 1 commit into
Conversation
The optimizer rewrites the output extension to WEBP for every supported input format when storePicturesInWEBP is set, including AVIF. But the extension substitution in ExportedImage (and its legacy variant) skipped AVIF, so the generated srcset kept .AVIF paths pointing at files that were never written, causing 404s for every optimized variant in production. Add AVIF to the substitution list so the generated URLs match the files the optimizer writes to disk. Fixes Niels-IO#263
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #263
Problem
When the source image is
.avifandnextImageExportOptimizer_storePicturesInWEBPis enabled (the default), the optimizer and the component disagree about the output extension:optimizeImages.tsrewrites the extension toWEBPfor every supported input whenstorePicturesInWEBPis set — including AVIF — so onlyphoto-opt-<width>.WEBPfiles are written to disk.ExportedImage(and the legacy variant) excludesAVIFfrom its extension-substitution list, so the generatedsrcsetkeeps.AVIFpaths.Result: every optimized variant of an AVIF source 404s in production.
Fix
Add
"AVIF"to the substitution list inexample/src/ExportedImage.tsxandexample/src/legacy/ExportedImage.tsx, matching what the optimizer writes. Behavior withstorePicturesInWEBP=falseis unchanged (extension staysAVIF, which matches the.AVIFfiles the optimizer writes in that mode).Verification
Rendered
ExportedImagewithsrc="/images/photo.avif"andstorePicturesInWEBP=trueviareact-dom/serveragainst the built package:Before:
After:
npm run buildpassesnpm testpasses (5 tests, 42 snapshots)