tailwindcss icon indicating copy to clipboard operation
tailwindcss copied to clipboard

@tailwindcss fails to resolve font URLs in external packages with Vite

Open DonCamillo11 opened this issue 9 months ago • 12 comments

What version of Tailwind CSS are you using?

v4.0.6

What build tool (or framework if it abstracts the build tool) are you using?

Vite 6.1.1

What version of Node.js are you using?

v22.13.0

What browser are you using?

Safari

What operating system are you using?

macOS

Reproduction URL

https://github.com/DonCamillo11/tailwind-bug

Describe your issue

I try to import fontawesome pro in my app.css. When running npm run build I get the following errors:

../webfonts/fa-brands-400.woff2 referenced in ../webfonts/fa-brands-400.woff2 didn't resolve at build time, it will remain unchanged to be resolved at runtime
../webfonts/fa-duotone-900.woff2 referenced in ../webfonts/fa-duotone-900.woff2 didn't resolve at build time, it will remain unchanged to be resolved at runtime
../webfonts/fa-regular-400.woff2 referenced in ../webfonts/fa-regular-400.woff2 didn't resolve at build time, it will remain unchanged to be resolved at runtime
../webfonts/fa-solid-900.woff2 referenced in ../webfonts/fa-solid-900.woff2 didn't resolve at build time, it will remain unchanged to be resolved at runtime
../webfonts/fa-light-300.woff2 referenced in ../webfonts/fa-light-300.woff2 didn't resolve at build time, it will remain unchanged to be resolved at runtime
../webfonts/fa-brands-400.ttf referenced in ../webfonts/fa-brands-400.ttf didn't resolve at build time, it will remain unchanged to be resolved at runtime
../webfonts/fa-duotone-900.ttf referenced in ../webfonts/fa-duotone-900.ttf didn't resolve at build time, it will remain unchanged to be resolved at runtime
../webfonts/fa-regular-400.ttf referenced in ../webfonts/fa-regular-400.ttf didn't resolve at build time, it will remain unchanged to be resolved at runtime
../webfonts/fa-solid-900.ttf referenced in ../webfonts/fa-solid-900.ttf didn't resolve at build time, it will remain unchanged to be resolved at runtime
../webfonts/fa-light-300.ttf referenced in ../webfonts/fa-light-300.ttf didn't resolve at build time, it will remain unchanged to be resolved at runtime

It was working with Tailwind v3

Image

but after updating my Laravel application to Tailwind 4 there seem to be a problem building the files.

Image

DonCamillo11 avatar Feb 20 '25 21:02 DonCamillo11