Material Components Web failed during yarn watch

Posted 4 months ago by DavidLambauerAtAOE

Hi,

I just tried to install Material Components Web to use them in my VueComponents. After I installed the package material-components-web via yarn, I added an import directive to my scss styles. Then, the following Error is thrown by yarn:

ERROR  Failed to compile with 1 errors                            11:03:47 PM

 error  in ./node_modules/@material/top-app-bar/mdc-top-app-bar.scss

Module build failed: Unknown word (1:1)

> 1 | //
    | ^
  2 | // Copyright 2018 Google Inc. All Rights Reserved.
  3 | //
  4 | // Licensed under the Apache License, Version 2.0 (the "License");


 @ ./node_modules/css-loader?sourceMap!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-f077ff84","scoped":false,"hasInlineConfig":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./resources/assets/js/components/ProduktList.vue 3:10-120
 @ ./node_modules/vue-style-loader!./node_modules/css-loader?sourceMap!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-f077ff84","scoped":false,"hasInlineConfig":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./resources/assets/js/components/ProduktList.vue
 @ ./resources/assets/js/components/ProduktList.vue
 @ ./resources/assets/js/app.js
 @ multi ./resources/assets/js/app.js ./resources/assets/sass/style.scss

                                              Asset     Size  Chunks                    Chunk Names
fonts/mathilde.otf?aaa05871daf325d1926b0dbd6058e7bb  37.6 kB          [emitted]
                                         /js/app.js  6.94 MB       0  [emitted]  [big]  /js/app
                                     /css/style.css  75.9 kB    0, 0  [emitted]         /js/app, /js/app

ERROR in ./node_modules/css-loader?sourceMap!./node_modules/@material/top-app-bar/mdc-top-app-bar.scss
Module build failed: Unknown word (1:1)

> 1 | //
    | ^
  2 | // Copyright 2018 Google Inc. All Rights Reserved.
  3 | //
  4 | // Licensed under the Apache License, Version 2.0 (the "License");

 @ ./node_modules/css-loader?sourceMap!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-f077ff84","scoped":false,"hasInlineConfig":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./resources/assets/js/components/ProduktList.vue 3:10-120
 @ ./node_modules/vue-style-loader!./node_modules/css-loader?sourceMap!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-f077ff84","scoped":false,"hasInlineConfig":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./resources/assets/js/components/ProduktList.vue
 @ ./resources/assets/js/components/ProduktList.vue
 @ ./resources/assets/js/app.js
 @ multi ./resources/assets/js/app.js ./resources/assets/sass/style.scss

Please sign in or create an account to participate in this conversation.

Laracasts Mascot

Hi, Have We Met Yet?

Did you know that, in addition to the forum, Laracasts includes well over 1000 lessons on modern web development? All for the price of one lunch out per month.

Sign Me Up

Channels

Reply to

Use Markdown with GitHub-flavored code blocks.