Summary
The Next.js image configuration removes dangerouslyAllowSVG: true. The getSafePlaceholderImageUrl helper still produces https://placehold.co/... placeholder URLs. This can prevent placeholder and fallback images from rendering in production when the remote response is SVG.
Required changes
- Review
getSafePlaceholderImageUrl and all placeholder image call sites.
- Make the placeholder format compatible with the current
next/image SVG policy, or explicitly configure the required safe SVG handling.
- Keep the remote image allowlist aligned with the selected placeholder solution.
Rationale
Placeholder and fallback images must render when a primary image is unavailable. The current configuration change can break this behavior for placehold.co SVG responses.
Affected areas
next.config.ts- The module that defines
getSafePlaceholderImageUrl
- Components that use placeholder or fallback image URLs
Acceptance criteria
- Placeholder and fallback images render in production.
- The selected solution does not re-enable unsafe SVG processing without the required safeguards.
- The configured
remotePatterns allow the selected placeholder host and path.
- Add or update focused coverage where practical.
Backlinks
Summary
The Next.js image configuration removes
dangerouslyAllowSVG: true. ThegetSafePlaceholderImageUrlhelper still produceshttps://placehold.co/...placeholder URLs. This can prevent placeholder and fallback images from rendering in production when the remote response is SVG.Required changes
getSafePlaceholderImageUrland all placeholder image call sites.next/imageSVG policy, or explicitly configure the required safe SVG handling.Rationale
Placeholder and fallback images must render when a primary image is unavailable. The current configuration change can break this behavior for
placehold.coSVG responses.Affected areas
next.config.tsgetSafePlaceholderImageUrlAcceptance criteria
remotePatternsallow the selected placeholder host and path.Backlinks