TypeError [ERR_INVALID_ARG_TYPE]: The "from" argument must be of type string. Received type undefined

[anonimitoraf]

• Operating System: Windows
• Node Version: 11.10
• Yarn Version:1.13.0
• webpack Version: 4.29.0
• css-loader Version: 2.1.0

Expected Behavior

Running yarn install && yarn storybook for kenshoo/react-multi-select@2704a32. (with a "fixed" webpack config) just works

Actual Behavior

Module build failed: TypeError [ERR_INVALID_ARG_TYPE]: The "from" argument must be of type string. Received type undefined
    at D:\css-loader!D:\Work\__Source\js\react-multi-select\src\components\search\search.scss:1:1
    at validateString (internal/validators.js:125:11)
    at Object.relative (path.js:492:5)
    at getLocalIdent (D:\Work\__Source\js\react-multi-select\node_modules\css-loader\dist\utils.js:50:33)
    at generateScopedName (D:\Work\__Source\js\react-multi-select\node_modules\css-loader\dist\index.js:90:16)
    at exportScopedName (D:\Work\__Source\js\react-multi-select\node_modules\postcss-modules-scope\src\index.js:64:26)
    at localizeNode (D:\Work\__Source\js\react-multi-select\node_modules\postcss-modules-scope\src\index.js:84:26)
    at Array.map (<anonymous>)
    at localizeNode (D:\Work\__Source\js\react-multi-select\node_modules\postcss-modules-scope\src\index.js:80:38)
    at traverseNode (D:\Work\__Source\js\react-multi-select\node_modules\postcss-modules-scope\src\index.js:103:20)
    at Array.map (<anonymous>)
    at traverseNode (D:\Work\__Source\js\react-multi-select\node_modules\postcss-modules-scope\src\index.js:109:38)
    at Array.map (<anonymous>)
    at traverseNode (D:\Work\__Source\js\react-multi-select\node_modules\postcss-modules-scope\src\index.js:109:38)
    at css.walkRules.rule (D:\Work\__Source\js\react-multi-select\node_modules\postcss-modules-scope\src\index.js:129:27)
    at D:\Work\__Source\js\react-multi-select\node_modules\css-loader\node_modules\postcss\lib\container.js:239:18
    at D:\Work\__Source\js\react-multi-select\node_modules\css-loader\node_modules\postcss\lib\container.js:135:18

Code

webpack.config.js

How Do We Reproduce?

1. Clone kenshoo/react-multi-select@2704a32.
2. Change .storybook/webpack.config.js to gist pasted above
3. Run yarn install
4. Run yarn storybook

[alexander-akait]

Regression in postcss css modules plugin, feel free to send a PR to postcss-modules-scope

[anonimitoraf]

Sorry, I'm quite unfamiliar with the implementation of these projects. I'll have a look when I get some time. Can you narrow down the potential things I have to look at?

[alexander-akait]

@anonimitoraf https://github.com/css-modules/postcss-modules-scope, i am on vacation on weekends, so i don't have time right now to investigate in reproducible repo above (not small), anyway if you find lines in your css what throw this error i can fix it, i am sure what to fix it will be very easy.

[jquense]

@evilebottnawi I took a quick look I don't think this is a regression in postcss-modules-scope the root cause is that the rootContext property on loaderContext is undefined, My guess is this is really a storybook version mismatch issue

[anonimitoraf]

@evilebottnawi That error message gets repeated multiple times for multiple files. One of the files (referenced by the error message I posted) is https://github.com/anonimitoraf/react-multi-select/blob/master/src/components/search/search.scss

@jquense I don't understand how it can be a storybook version issue unless it means a different storybook version = different webpack config. Which makes me think of maybe checking the webpack config's file history

[alexander-akait]

@anonimitoraf hm, very strange, i will look on this in near future

[alexander-akait]

@anonimitoraf problem what css-loader doesn't have compatibility with webpack@3 (old version of storybook uses old version of webpack and css-loader), you need update storybook to latest version. I will add check to avoid this problem, but only because code for generation locals looks ugly, you need update deps to avoid this and same problem in future, thanks