SASS Built-in moules Error: Invalid CSS after

Viewed 3695

I do not connect the built-in modules, or I do not use them correctly. Please help me. I use the gulp, and I can't understand why I have the error:

Error: Invalid CSS after "... $height: math": expected expression (e.g. 1px, bold), was ".div($size, 2)"

scss file

@use 'sass:math';

$height: math.div($size, 2);

gulp file

...
function styles() {
  return gulp
    .src("./src/scss/*.scss")
    .pipe(plumber({ errorHandler: onError }))
    .pipe(sourcemaps.init())
    .pipe(sass())
    .pipe(
      autoprefixer({
        cascade: false,
      })
    )
    .pipe(cleanCSS())
    .pipe(sourcemaps.write())
    .pipe(rename({ suffix: ".min" }))
    .pipe(gulp.dest("./dest/css"))
    .pipe(browserSync.stream())
}
...
1 Answers

I used gulp-sass, instead of gulp-dart-sass.

because sass:math Compatibility: Dart Sass since 1.23.0

Related