Search code examples
vue.jssassvuejs2sass-loaderdart-sass

Disable Dart SASS Warnings Produced By External Theme File


I have a third party SCSS file that I am including in my project, and Dart SASS is displaying a long list of warnings as a result. How can I disable the warnings for third party includes?

I'm using Vue with Dart SCSS. Dart has a quietDeps option, but I'm not sure if I'm using it the right way.

// _common.scss
// Line below causes warnings to be displayed.
@import "~@progress/kendo-theme-default/dist/all";
// ...
// Vue.config.js
module.exports = {
  // ...
  css: {
    loaderOptions: {
      sass: {
        prependData: '@import "~@/styles/common";',
        sassOptions: {
          quietDeps: true
        }
      }
    }
  }
}

Solution

  • See the following issues: https://github.com/webpack-contrib/sass-loader/issues/954 and https://github.com/sass/sass/issues/3065.

    The quietDeps option isn't exposed yet to the Node.js API.

    In the meantime you can downgrade to sass 1.32 without too many changes.

    EDIT: It's now available in sass 1.35.1.