Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

SCSS: Deprecation warning because of "/" as division operator (sass >= v.1.33) #1245

Open
mandrasch opened this issue Jan 20, 2023 · 0 comments · May be fixed by #1548
Open

SCSS: Deprecation warning because of "/" as division operator (sass >= v.1.33) #1245

mandrasch opened this issue Jan 20, 2023 · 0 comments · May be fixed by #1548
Labels

Comments

@mandrasch
Copy link

mandrasch commented Jan 20, 2023

Feature Request

Is your feature request related to a problem? Please describe

Hey, just came across the following. We compile the scss from bootstrap package via typo3_encore and Webpack Encore (NodeJS). With the the latest version of dart-sass this resulted in some deprecation warnings.

This is because the official implementation for sass - dart-sass - will drop support for using "/" as a division operator:

Breaking Change: Slash as Division

Since sass v1.33.0 they implemented the following deprecation warning:

Module Warning (from ./node_modules/sass-loader/dist/cjs.js):
Deprecation Using / for division outside of calc() is deprecated and will be removed in Dart Sass 2.0.0.

Recommendation: math.div($grid-gutter-width, 2) or calc($grid-gutter-width / 2)

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

public/typo3conf/ext/bootstrap_package/Resources/Public/Scss/components/_navbar.scss 136:25  @import

Reproduction is possible via:

  1. Download bootstrap package
  2. Run npx sass Resources/Public/Scss/bootstrap5/theme.scss output.css (this will use latest version 1.57.1)

image

Describe the solution you'd like

Sass project states:

"Recommendation: math.div($grid-gutter-width, 2) or calc($grid-gutter-width / 2)
More info and automated migrator: https://sass-lang.com/d/slash-div"

Would be cool if these warnings would be fixed, since there is no option to disable this behaviour in dart-sass.

Describe alternatives you've considered

  • Stick to scssphp ;-)
  • Currently I downgraded dart sass to last version before 1.33 "sass": "~1.32.13" to ged rid of these warnings while developing

Additional context

Since bootstrap_package uses scssphp by default, I did not commit this as "bug". scssphp states "Note that scssphp is not fully compliant with the Sass specification yet. Sass modules are not implemented yet either." - but maybe they will also drop support for "/" as division operator in future?

Thanks for providing the bootstrap package as OS, very much appreciated, cheers!

Beltshassar added a commit to Beltshassar/bootstrap_package that referenced this issue Jan 28, 2025
@Beltshassar Beltshassar linked a pull request Jan 28, 2025 that will close this issue
9 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant