Prerequisites
Describe the issue
I'm using bootstrap in my react project. While bundling the app via ParcelJS I'm getting some sass deprection warnings. One might look like this:
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/_reboot.scss
503 │ font-weight: $legend-font-weight;
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ 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/_reboot.scss 503:3 @import
node_modules/bootstrap/scss/bootstrap.scss 16:9 @import
Bootstrap: 5.3.3
NodeJS: 22.6.0
npm: 10.8.2
Reduced test cases
What operating system(s) are you seeing the problem on?
macOS, Linux
What browser(s) are you seeing the problem on?
Chrome
What version of Bootstrap are you using?
v5.3.3
Prerequisites
Describe the issue
I'm using bootstrap in my react project. While bundling the app via ParcelJS I'm getting some sass deprection warnings. One might look like this:
Bootstrap: 5.3.3
NodeJS: 22.6.0
npm: 10.8.2
Reduced test cases
What operating system(s) are you seeing the problem on?
macOS, Linux
What browser(s) are you seeing the problem on?
Chrome
What version of Bootstrap are you using?
v5.3.3