mirror of
https://github.com/vercel/next.js.git
synced 2026-09-20 02:25:18 +08:00
Jude Gao
6c105133e7
This PR fixes a critical issue with the `experimental.inlineCss` feature where CSS `url()` references to fonts and other assets would break when CSS was inlined into `<style>` tags instead of being loaded via external `<link>` tags. The problem occurred because relative URLs in CSS are resolved relative to the CSS file's location when loaded externally, but when the CSS is inlined directly into the HTML document, those same relative URLs resolve relative to the HTML document instead, causing 404 errors for fonts and images. We fixed this by detecting when CSS is being prepared for inlining and switching from relative URLs (like `../_next/static/media/font.woff2`) to absolute URLs (like `/_next/static/media/font.woff2`) in both the Webpack and Turbopack bundlers. This ensures that asset references work correctly regardless of whether the CSS is inlined or external, while maintaining the existing optimization of using relative URLs for the default case where CSS is loaded via external stylesheets. The fix is transparent to users and requires no changes to application code—simply enabling `experimental.inlineCss: true` will now work correctly with all CSS asset references. Fixes https://github.com/vercel/next.js/issues/83674 --------- Co-authored-by: Niklas Mischkulnig <4586894+mischnic@users.noreply.github.com>