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
}
}
}
}
}
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.
For anyone who looking for Encore configuration
Encore.enableSassLoader((options) => {
options.sassOptions = {
quietDeps: true, // disable warning msg
}
})
For NuxtJS add this to nuxt.config.js
build: {
loaders: {
scss: {
sassOptions: {
quietDeps: true
}
}
}
}