Problem/Motivation

Just performed a fresh install using the docs (but used yarn install for package installs)

Seeing a lot of depracation warnings:

Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in `& {}`.

More info: https://sass-lang.com/d/mixed-decls

┌──> node_modules\bootstrap\scss\_type.scss
39 │ font-style: $display-font-style;
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ declaration
╵
┌──> node_modules\bootstrap\scss\vendor\_rfs.scss
136 │ ┌ @media (#{$rfs-mq-property-width}: #{$rfs-mq-value}) {
137 │ │ @content;
138 │ │ }
│ └─── nested rule
╵
node_modules\bootstrap\scss\_type.scss 39:5 @import
node_modules\bootstrap\scss\bootstrap.scss 17:9 root stylesheet

Any hints as to what the issue could be?

Comments

newaytech created an issue.

newaytech’s picture

newaytech commented

A little further insight here: https://github.com/twbs/bootstrap/issues/40621

Maybe we just sit tight for a fix?

maxmendez’s picture

maxmendez commented

Thank you @newaytech for the link.

Only to inform to everyone face this and research information:

The problem is a change in sass since version 1.77.7, the problem will be fixed on bootstrap v5.3.4, if you want to remove the warnings you can update the package.json in your theme and set sass version to 1.77.6.

Something like this
"sass": "1.77.6"

oligerd’s picture

oligerd commented

Thank you @newaytech and @maxmendez
I 've changed it manually, but
npm i sass@1.77.6 --save-exact
also works!

luis93’s picture

luis93 commented

Deprecation Warning: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.

More info: https://sass-lang.com/d/legacy-js-api

Deprecation Warning: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.

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

Thanks you @oligerd this works for me:

I had in my packaje.json:
"sass": "^1.45.0"

but, I changed this manually:
ddev npm i sass@1.77.6 --save-exact

aubjr_drupal’s picture

aubjr_drupal commented

This also just fixed multiple other deprecation warnings, from color functions (red()|green()|blue()), global built-in functions, if() syntax, @import, etc. Thanks!