'Deprecation Warning in Bootstrap SCSS
I am trying to create custom bootstrap by importing only the required components into a style.scss
file from bootstrap sass. However, I get a chain of many Deprecation Warnings when I import and compile the 3 required components.
SCSS:
@import "./bootstrap-4.3.1/scss/functions";
@import "./bootstrap-4.3.1/scss/variables";
@import "./bootstrap-4.3.1/scss/mixins";
Console Warning (first of the many):
Deprecation Warning: Using / for division is deprecated and will be removed in Dart Sass 2.0.0.
Recommendation: math.div($spacer, 2)
More info and automated migrator: https://sass-lang.com/d/slash-div
╷
298 │ $headings-margin-bottom: $spacer / 2 !default;
│ ^^^^^^^^^^^
╵
bootstrap-4.3.1\scss\_variables.scss 298:31 @import
style.scss 3:9 root stylesheet
I am using the following versions of tools:
Bootstrap: 4.3.1
, Sass: 1.33.0 compiled with dart2js 2.13.0
Is anything wrong with using this version combination, or any other issue? How can I resolve it?
Solution 1:[1]
Essentially, what I understand is that a new version of SASS
is throwing warnings. You can downgrade your version to stop the warnings for now and doing so shouldn't break anything either.
tl:dr You should use Sass: "1.32.13"
instead.
Solution 2:[2]
If You wanna resolve this issue You can review sass options from Sass-lang
and add the best option for your sass
In my case, I have this issue
Deprecation Warning: Using / for division outside of calc() is deprecated and will be removed in Dart Sass 2.0.0.
So I added "quietDeps" option to my sass
.pipe(sass({
outputStyle: 'compressed',
quietDeps: true
}).on('error', sass.logError))
and worked correctly after run my tasks again
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | deekeh |
Solution 2 | Albaz |