css-loader: style is not affective on vue demo
- Operating System: window10
- Node Version: v10.15.3
- NPM Version: 6.4.1
- webpack Version: 4.44.1
- css-loader Version: 4.2.0
Expected Behavior
I use wepback make a simple vue demo, try to use scss-loader parse scss style, expect below picture

Actual Behavior
but,now is this picture. You can css style is not become effective, because <style> attribute is not appear to html.

Code
{
test: /\.scss$/,
use: [
{
loader: 'vue-style-loader',
options: {
// sourceMap: false,
// shadowMode: false,
},
},
{
loader: 'css-loader',
options: {
// sourceMap: false,
// importLoaders: 2,
// modules: {
// localIdentName: '[name]_[local]_[hash:base64:5]',
// },
},
},
{
loader: 'sass-loader',
options: {
sourceMap: false,
},
},
],
}
// additional code, HEY YO remove this block if you don't need it
Solution
I try to downgrade css-loader to 3.5.3,webpack builded ok,I dont know why is it.
About this issue
- Original URL
- State: closed
- Created 4 years ago
- Comments: 22 (18 by maintainers)
I believe, I know why it happens: in their update from v3.6.0 to v4.0.0 they bumped
loader-utilsdependency from v1.2.3 to v2.0.0. That altered generated hashes in class names, and right away breaks any web app setups with server-side rendering, as hashes generated at server-side (usually with alternative tools) mismatch hashes generated by webpack-bundled JS. Very bad,css-loaderguys did not noticed this change, and have not mentioned it explicitly as a huge breaking change in the release notes.Also, I am still struggling to figure out how to achieve old hash values with the latest
css-loader. I figured out, theloader-utilschanged the default hashing algo frommd5tomd4, but so far it seems that just specifyingmd5explicitly still does not result in the old values. Should be some extra changes affecting hashes (or might be I am doing something stupid).UPDATED: And I found the second reason of changed hashes: https://github.com/webpack-contrib/css-loader/blob/master/src/utils.js#L60 It used to join the path and class name by
+in v3.6.0, now it joins them by\u0000. As it is hard-coded, there is no way to keep hash values with v3.6.0 > v4.2.0 upgrade 😭