-
-
Notifications
You must be signed in to change notification settings - Fork 6.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Vite version 2.9.2 and beyond don't honor external package CSS/Sass module inclusion in output bundle #8461
Comments
@sapphi-red can you expand on this? I just tried 3.0.0-alpha.2 in my reproduction repo ( it's not until version 3.0.0-alpha.4 that it actually loads up in dev correctly again. that being said, if you run |
About 3.0.0-alpha.2, that was a bug which is fixed after 3.0.0-alpha.4. About that "require is not defined" error, it seems there is a different bug. A similar error happens even after updating plugin-react to 2.0.0-alpha.2. |
@sapphi-red got it, so this is a known issue and not one with my code then. hopefully it can get sorted in the next alpha release. appreciate the quick responses to this issue. for the time being i'll downgrade to vite 2.9.1 and eagerly await the 3.0.0 release (which will hopefully fix all the bugs :) |
related: #6179 |
Describe the bug
This bug is evident in any version of Vite after v2.9.1.
When you have an external npm module (in this case, @reintroducing/my-package) that loads its own Sass file as a CSS module, using that file in dev mode works perfectly fine and you can see the CSS associated with the external module reflected in your dev server. But if you build and preview that code, you will see that the CSS for the external module is there but the class is not applied to the element and there is no mention of the module name in the output JS bundle.
Steps to Reproduce Working Version
npm i
.npm run dev
. Observe the Test button and its blue background.Button-module-root
as expected.npm run preview
. Observe the Test button and its blue background.Button-module-root
as expected.dist
, openassets/index[hash].js
and search forButton-module-root
to verify it is there.dist
, openassets/index[hash].css
and search forButton-module-root
to verify it is there.Steps to Reproduce Non-Working Version
npm i
.npm run dev
. Observe the Test button and its blue background.Button-module-root
as expected.npm run preview
. Observe the Test button and the missing blue background.Button-module-root
as expected.dist
, openassets/index[hash].js
and search forButton-module-root
to verify it is no longer there.dist
, openassets/index[hash].css
and search forButton-module-root
to verify it is there.The code for the external
Button
is super simple and can be found here.Reproduction
https://github.com/reintroducing/vite-bug
System Info
Used Package Manager
npm
Logs
No response
Validations
The text was updated successfully, but these errors were encountered: