tailwindcss
tailwindcss copied to clipboard
[V4] Module dection not working in solid start
What version of Tailwind CSS are you using?
v4.0.0-alpha.7
What build tool (or framework if it abstracts the build tool) are you using?
[email protected], [email protected]
What version of Node.js are you using?
v20.11.1
What browser are you using?
Chrome
What operating system are you using?
macOS
Reproduction URL
Sadly not startable in a webcontainer as it can't load native addons but this is the minimal repro.
Describe your issue
As the new vite plugin analyzes the module graph it can't detect solid starts routes. Because solid supplies a FileRoutes component which determines what to display. This probably won't notify tailwind plugin about the files. You can see in the repro that Nav gets styled as it is directly imported, but anything in routes which gets added during compile won't be styled.
Maybe a config for the vite plugin could solve this. Like suppling an options object:
{
"outsideModuleGraph": "./src/routes/**/*.{ts,tsx,js,jsx}"
}
I tried a few things today with similar issues. The main one being the error:
[!caution]
Could not find css module ${pathToCssFileWhereTailwindIsImported}
(which is rendered multiple times) This tends happen on initial start of the server.
When editing the file where tailwind is imported it seems the module is invalidated and the tailwind styles are applied. Even when not having any tw-specific classes in one of the routes, the preflight should be at least applied, right? This is not happening for me either.
Might this also be an issue with vinxi
? (noticed server.moduleGraph
is null at start, which might be a execution timing issue 🤷♂️)
https://github.com/tailwindlabs/tailwindcss/blob/388d1b02984660249b16f392099f5c359615aabf/packages/%40tailwindcss-vite/src/index.ts#L25
Small update
The error Could not find css module ${pathToCssFileWhereTailwindIsImported}
seems fixed with https://github.com/tailwindlabs/tailwindcss/commit/8123fa513a2749a5a9cac325a0f0a55dc0219138 in v4.0.0-alpha.8
Just made the suggested change @oddcelot and the styling issue is gone.
Hey! It looks like this issue is indeed fixed since alpha 8. We tried the repro on the latest alpha version and it works fine. Feel free to reach out if you have other issues.