importing MDC material components SASS - material-design

Question

I need to complete this exercise:
https://codelabs.developers.google.com/codelabs/mdc-102-web#2
But after all of these steps I get an error:
PS C:\Users\yuriy\Documents\GitHub\material\mdc-101\starter> npm start
> mdc-101-web#0.0.0 start C:\Users\yuriy\Documents\GitHub\material\mdc-101\starter
> webpack-dev-server --progress
10% [3] building modules 1/1 modules 0 active
Project is running at http://localhost:8081/
webpack output is served from /
[0] Hash: 555d1685cfed3b864a6318f77429ebbf5a38e07aeeac2c79f02ede37da1c2e8bbb7df60d48519ced
Version: webpack 3.12.0
Child
Hash: 555d1685cfed3b864a63
Time: 5520ms
Asset Size Chunks Chunk Names
bundle-login.css 56.6 kB [emitted]
style-bundle-login.js 335 kB 0 [emitted] [big] main
[2] multi (webpack)-dev-server/client?http://localhost:8081 ./login.scss 40 bytes {0} [built]
[3] (webpack)-dev-server/client?http://localhost:8081 7.93 kB {0} [built]
[4] ./node_modules/url/url.js 23.3 kB {0} [built]
[5] ./node_modules/node-libs-browser/node_modules/punycode/punycode.js 14.7 kB {0} [built]
[7] ./node_modules/url/util.js 314 bytes {0} [built]
[8] ./node_modules/querystring-es3/index.js 127 bytes {0} [built]
[11] ./node_modules/strip-ansi/index.js 161 bytes {0} [built]
[12] ./node_modules/ansi-regex/index.js 135 bytes {0} [built]
[13] ./node_modules/loglevel/lib/loglevel.js 8.86 kB {0} [built]
[14] (webpack)-dev-server/client/socket.js 1.08 kB {0} [built]
[15] ./node_modules/sockjs-client/dist/sockjs.js 181 kB {0} [built]
[16] (webpack)-dev-server/client/overlay.js 3.67 kB {0} [built]
[22] (webpack)/hot nonrecursive ^\.\/log$ 170 bytes {0} [built]
[24] (webpack)/hot/emitter.js 77 bytes {0} [built]
[26] ./login.scss 62 bytes {0} [built]
+ 12 hidden modules
Child
Hash: 18f77429ebbf5a38e07a
Time: 3083ms
Asset Size Chunks Chunk Names
style-bundle-home.js 335 kB 0 [emitted] [big] main
[2] multi (webpack)-dev-server/client?http://localhost:8081 ./home.scss 40 bytes {0} [built]
[3] (webpack)-dev-server/client?http://localhost:8081 7.93 kB {0} [built]
[4] ./node_modules/url/url.js 23.3 kB {0} [built]
[5] ./node_modules/node-libs-browser/node_modules/punycode/punycode.js 14.7 kB {0} [built]
[7] ./node_modules/url/util.js 314 bytes {0} [built]
[8] ./node_modules/querystring-es3/index.js 127 bytes {0} [built]
[11] ./node_modules/strip-ansi/index.js 161 bytes {0} [built]
[12] ./node_modules/ansi-regex/index.js 135 bytes {0} [built]
[13] ./node_modules/loglevel/lib/loglevel.js 8.86 kB {0} [built]
[14] (webpack)-dev-server/client/socket.js 1.08 kB {0} [built]
[15] ./node_modules/sockjs-client/dist/sockjs.js 181 kB {0} [built]
[16] (webpack)-dev-server/client/overlay.js 3.67 kB {0} [built]
[22] (webpack)/hot nonrecursive ^\.\/log$ 170 bytes {0} [built]
[24] (webpack)/hot/emitter.js 77 bytes {0} [built]
[26] ./home.scss 565 bytes {0} [built] [failed] [1 error]
+ 12 hidden modules
ERROR in ./home.scss
Module build failed:
undefined
^
Can't find stylesheet to import.
╷
22 │ #use '#material/theme/theme-color';
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
node_modules\#material\list\_variables.scss 22:1 #forward
node_modules\#material\drawer\mdc-drawer.import.scss 13:1 #import
stdin 2:9 root stylesheet
in C:\Users\yuriy\Documents\GitHub\material\mdc-101\starter\node_modules\#material\list\_variables.scss (line 22, column 1)
# multi (webpack)-dev-server/client?http://localhost:8081 ./home.scss
Child
Hash: eeac2c79f02ede37da1c
Time: 2339ms
Asset Size Chunks Chunk Names
bundle-login.js 526 kB 0 [emitted] [big] main
[5] ./node_modules/#material/ripple/foundation.js 23.4 kB {0} [built]
[6] ./node_modules/#material/ripple/util.js 1.91 kB {0} [built]
[8] ./node_modules/#material/textfield/constants.js 2.81 kB {0} [built]
[24] multi (webpack)-dev-server/client?http://localhost:8081 ./login.js 40 bytes {0} [built]
[25] (webpack)-dev-server/client?http://localhost:8081 7.93 kB {0} [built]
[26] ./node_modules/url/url.js 23.3 kB {0} [built]
[33] ./node_modules/strip-ansi/index.js 161 bytes {0} [built]
[35] ./node_modules/loglevel/lib/loglevel.js 8.86 kB {0} [built]
[36] (webpack)-dev-server/client/socket.js 1.08 kB {0} [built]
[38] (webpack)-dev-server/client/overlay.js 3.67 kB {0} [built]
[44] (webpack)/hot nonrecursive ^\.\/log$ 170 bytes {0} [built]
[46] (webpack)/hot/emitter.js 77 bytes {0} [built]
[48] ./login.js 385 bytes {0} [built]
[49] ./node_modules/#material/textfield/index.js 1.36 kB {0} [built]
[61] ./node_modules/#material/ripple/index.js 1.29 kB {0} [built]
+ 47 hidden modules
Child
Hash: 2e8bbb7df60d48519ced
Time: 2142ms
Asset Size Chunks Chunk Names
bundle-home.js 437 kB 0 [emitted] [big] main
[0] ./node_modules/#material/list/constants.js 3.35 kB {0} [built]
[5] ./node_modules/#material/list/foundation.js 28.5 kB {0} [built]
[8] multi (webpack)-dev-server/client?http://localhost:8081 ./home.js 40 bytes {0} [built]
[9] (webpack)-dev-server/client?http://localhost:8081 7.93 kB {0} [built]
[10] ./node_modules/url/url.js 23.3 kB {0} [built]
[11] ./node_modules/node-libs-browser/node_modules/punycode/punycode.js 14.7 kB {0} [built]
[13] ./node_modules/url/util.js 314 bytes {0} [built]
[17] ./node_modules/strip-ansi/index.js 161 bytes {0} [built]
[19] ./node_modules/loglevel/lib/loglevel.js 8.86 kB {0} [built]
[20] (webpack)-dev-server/client/socket.js 1.08 kB {0} [built]
[22] (webpack)-dev-server/client/overlay.js 3.67 kB {0} [built]
[28] (webpack)/hot nonrecursive ^\.\/log$ 170 bytes {0} [built]
[30] (webpack)/hot/emitter.js 77 bytes {0} [built]
[32] ./home.js 110 bytes {0} [built]
[33] ./node_modules/#material/list/index.js 1.25 kB {0} [built]
+ 23 hidden modules
webpack: Failed to compile.
I have tried to use npm audit, but it doesn't work. I have tried to change fibers version to 5.0.0, but anyway it doesn't work. What should I change?
My code is available here:
https://github.com/yytrofimov/material

Answer 1

Both component should be installed in version 6.0.0:
npm install #material/drawer#^6.0.0
npm install #material/list#^6.0.0