Dart SASS warnings from kendo-theme-default

[Alex]

Hello,

I am using kendo-theme-default 4.38.1 and get a lot of deprecated warnings from Dart SASS.  I've put an example warning below. Is there a workaround to prevent kendo-theme-default from causing all of these warnings?

DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0.

Recommendation: math.div($button-padding-x, 2)

More info and automated migrator: https://sass-lang.com/d/slash-div

   ╷
20 │ $button-padding-x-sm: $button-padding-x / 2 !default;
   │                       ^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules\@progress\kendo-theme-default\scss\button\_variables.scss 20:23  @import
    src\styles\_common.scss 5:9                                                   @import
    stdin 1:9   

 

There is a --quiet-deps command line option. I've attempted to add this to vue.config.js (see below), which is what's used to configure sass-loader. Unfortunately, I can't tell if I have it configured the right way or whether --quiet-deps will actually do what I want.

module.exports = {
  // ...
  css: {
    loaderOptions: {
      sass: {
        prependData: '@import "~@/styles/common";',
        sassOptions: {
          quietDeps: true
        }
      }
    }
  }
}

 

[Alex]

There is an open issue for the warnings generated by the Kendo themes, so I will wait on that update. I would still like to know how to disable warnings from third party code, but that isn't a Vue specific question.

[Neli]

Hi Alex,

As you mentioned there is a logged issue about the 'Deprecated / for division use in SASS themes' warning. I am afraid that currently, I could not suggest a possible workaround for avoiding the warning to appear.

Regards,
Neli
Progress Telerik