[mdc-dialog] [mdc-card] Inconsistent or unclear import/use, namespace, and mixin instructions

Your Environment:

"@material/button": "^5.1.0",
"@material/dialog": "^5.1.0",

OS: Ubuntu 18.04 Build Environment: dart-sass, webpack, webpack dart sass loader

I was unclear, on the instructions in the mdc card readme, how to use a mixin. A helpful person pointed out that, though it isn’t noted in the documents, to use the mixins listed in the table, you must do the following:

@use "@material/card/mdc-card"; // generates classes for .mdc-card
@use "@material/card"; // does not generate classes, is used to access mixins and variables

div {
  // The prefix for @use "@material/card" is `card`
  @include card.fill-color(#DADCE0);
}

I’d like to use the excellent mixins that are allegedly provided for the dialog package.

So, I try

 @use "@material/dialog/mdc-dialog";
 @use "@material/dialog";

But, I get the following error:

SassError: Can't find stylesheet to import.

Hm. How can I use the dialog mixins?

Further information can be found at the following issue, which is now closed, so I hope it’s ok to open a new one: https://github.com/material-components/material-components-web/issues/5708

[asyncLiz]

This sounds like you’re using sass-loader. I just tried compiling my example Sass and it worked for me.

With sass-loader you need webpackImporter: false as described in https://github.com/webpack-contrib/sass-loader/issues/804#issuecomment-586095020

[komali2]

@komali2 I’ll be curious to hear if you are able to get the SassError resolved with the workaround for the bug @asyncLiz mentioned. Configuring the sass-loader option webpackImporter: false has resolved the error for my projects when running on MacOS and Windows. However, I still get the error when compiling the project in a docker container running Debian Linux.

Since Ubuntu is based on Debian, you may run into the same issue I’ve described in webpack-contrib/sass-loader#822. If the workaround does fix your error, knowing which version of Ubuntu you are running may help me find a workaround for my CI/CD pipeline.

• Ubuntu 18.04.4
• Intel® Core™ i7-8650U CPU @ 1.90GHz × 8
• Intel® UHD Graphics 620 (Kabylake GT2)
• 64-bit
• GNOME 3.28.2