How to compile Material.io design with gulp-sass without using Webpack?

Question

I'm using this tutorial at Material.io and want to use Material.io with gulp-sass.
But when I try to compile it, it shows the error

@material\button\mdc-button.scss
Error: Invalid CSS after "@include mixins": expected 1 selector or at-rule, was ".core-styles;"

The repository is located at GitHUB.

score 4 · Answer 1 · answered Apr 07 '20 at 19:57

4

It looks like you're trying to use node-sass. MDC Web Components version 5 uses the Sass Modules syntax, which is currently only supported by Dart Sass.

npm install sass

Then in gulpfile.js:

var sass = require('gulp-sass');
sass.compiler = require('sass');

answered Apr 07 '20 at 19:57

mloar

1,514
11
11

Man your answer should be accepted. You saved me a lot of hours of work. Thanks. GOD bless. – Edper May 27 '20 at 10:35
100% agree this should be the accepted answer, you saved my bacon! – Dan Norris Dec 16 '20 at 17:08

How to compile Material.io design with gulp-sass without using Webpack?

1 Answers1