Skip to content

SASS deprecation warnings despite upgrading to BS 5.3.5 #41367

@VBproDev

Description

@VBproDev

Prerequisites

Describe the issue

Normally importing Bootstrap in SASS-

@import "bootstrap/scss/bootstrap.scss";
@import "bootstrap/scss/bootstrap-utilities.scss";

leads to 200+ deprecation warnings upon build (I have pasted a small sample, hundreds more spam the terminal)-

Deprecation Warning [color-functions]: red() is deprecated. Suggestion:

color.channel($color, "red", $space: rgb)

More info: https://sass-lang.com/d/color-functions

    ╷
185 │     "r": red($color),
    │          ^^^^^^^^^^^
    ╵
    ..\..\..\bootstrap\scss\_functions.scss 185:10  luminance()
    ..\..\..\bootstrap\scss\_functions.scss 174:8   contrast-ratio()
    ..\..\..\bootstrap\scss\_functions.scss 159:22  color-contrast()
    ..\..\..\bootstrap\scss\_variables.scss 846:42  @import
    ..\..\..\bootstrap\scss\bootstrap.scss 8:9      @import
    ..\..\..\..\src\styles\custom.scss 1:9          root stylesheet

Deprecation Warning [color-functions]: green() is deprecated. Suggestion:

color.channel($color, "green", $space: rgb)

More info: https://sass-lang.com/d/color-functions

    ╷
186 │     "g": green($color),
    │          ^^^^^^^^^^^^^
    ╵
    ..\..\..\bootstrap\scss\_functions.scss 186:10  luminance()
    ..\..\..\bootstrap\scss\_functions.scss 174:8   contrast-ratio()
    ..\..\..\bootstrap\scss\_functions.scss 159:22  color-contrast()
    ..\..\..\bootstrap\scss\_variables.scss 846:42  @import
    ..\..\..\bootstrap\scss\bootstrap.scss 8:9      @import
    ..\..\..\..\src\styles\custom.scss 1:9          root stylesheet

Deprecation Warning [color-functions]: blue() is deprecated. Suggestion:

color.channel($color, "blue", $space: rgb)

More info: https://sass-lang.com/d/color-functions

    ╷
187 │     "b": blue($color)
    │          ^^^^^^^^^^^^
    ╵
    ..\..\..\bootstrap\scss\_functions.scss 187:10  luminance()
    ..\..\..\bootstrap\scss\_functions.scss 174:8   contrast-ratio()
    ..\..\..\bootstrap\scss\_functions.scss 159:22  color-contrast()
    ..\..\..\bootstrap\scss\_variables.scss 846:42  @import
    ..\..\..\bootstrap\scss\bootstrap.scss 8:9      @import
    ..\..\..\..\src\styles\custom.scss 1:9          root stylesheet

Deprecation Warning [color-functions]: red() is deprecated. Suggestion:

color.channel($color, "red", $space: rgb)

More info: https://sass-lang.com/d/color-functions

   ╷
37 │   @return red($value), green($value), blue($value);
   │           ^^^^^^^^^^^
   ╵
    ..\..\..\bootstrap\scss\_functions.scss 37:11   to-rgb()
    ..\..\..\bootstrap\scss\_variables.scss 846:31  @import
    ..\..\..\bootstrap\scss\bootstrap.scss 8:9      @import
    ..\..\..\..\src\styles\custom.scss 1:9          root stylesheet

Deprecation Warning [color-functions]: green() is deprecated. Suggestion:

color.channel($color, "green", $space: rgb)

More info: https://sass-lang.com/d/color-functions

   ╷
37 │   @return red($value), green($value), blue($value);
   │                        ^^^^^^^^^^^^^
   ╵
    ..\..\..\bootstrap\scss\_functions.scss 37:24   to-rgb()
    ..\..\..\bootstrap\scss\_variables.scss 846:31  @import
    ..\..\..\bootstrap\scss\bootstrap.scss 8:9      @import
    ..\..\..\..\src\styles\custom.scss 1:9          root stylesheet

Warning: 246 repetitive deprecation warnings omitted.
Run in verbose mode to see all warnings.

Reduced test cases

I'm aware that this issue has been discussed in great detail in this #40621 . Earlier a 'hack' was recommended for this issue, it was to degrade SASS to 1.77.6. Then, when 5.3.5 and 5.3.4 were released, it was said that the new versions have a permanent fix for this problem. However, as I illustrated above, this issue isn't resolved by bumping Bootstrap to 5.3.4/5 (for context, I use the latest sass-embedded package at 1.86.3). I had raised this issue in the same thread, it received some support, but no answers were given. So I'm raising a new issue to draw attention that the fix of the SASS deprecation (bumping Bootstrap) doesn't work

What operating system(s) are you seeing the problem on?

Windows

What browser(s) are you seeing the problem on?

No response

What version of Bootstrap are you using?

v5.3.5

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions