Qwik uses import before it's processed by vite plugin

[wmertens]

Qwik Version

0.12.0

Operating System (or Browser)

stackblitz

Node Version (if applicable)

No response

Which component is affected?

Qwik Rollup / Vite plugin

Expected Behaviour

I'm trying to make Qwik work with Vanilla-Extract. The problem is that VE generates a virtual CSS file that should be imported by Qwik, but that doesn't happen. Instead I adapted the VE vite plugin so that it exports the css string as part of the import, and I'm giving that to useStyles$(), but that doesn't inject the newly generated css, only the old css from the css.ts file that wasn't processed yet.

Actual Behaviour

Repro link

In dist/build/q-069f...js you can see the result of the build of the header component which imports vanilla-extract css, and in server/entry.preview.mjs you can find the string "this should not be in the build", a string that should not be in the build ;-)

Additional Information

I tried moving the plugins around, but that didn't make a difference.

[bolt-new-by-stackblitz[bot]]

Start a new pull request in StackBlitz Codeflow.

• qwik-starter-xk9ctw (Open reproduction)

[manucorporat]

I am not sure why this is an issue with Qwik, but looking

[wmertens]

@manucorporat actually I just realized it could be the same bug, twice :)

The first bug is that Qwik doesn't use the generated CSS file, which is imported from the transformed .css.ts file

This made me add the css export, which is also not read after transform, but before.

So I think the bug is that the Qwik vite plugin reads files before other plugins transformed them.

[wmertens]

Maybe all that needs to happen is to remove this line?

https://github.com/BuilderIO/qwik/blob/main/packages/qwik/src/optimizer/src/plugins/vite.ts#L57

[wmertens]

Hmm I tried overriding enforce and it doesn't seem to make a difference

[wmertens]

The repro now works :) No change on Qwik side needed, but on VE https://github.com/vanilla-extract-css/vanilla-extract/pull/895