Deprecation Warnings "using / outside of calc" from Dart Sass

[konung]

Here is a screenshot.

Simply wrapping those to spots in calc(), solves the issues.

[brandonmcconnell]

@konung Awesome, thanks! 🙂 Could you open a PR for this so I can merge it into my repo?

In your testing, does the calc() make it into the final processed CSS, or does it get eval'd by SCSS? My main goal here is to make sure that all math is handled by SCSS so that CSS can carry out the animation with minimal processing.

[konung]

@brandonmcconnell No Problem 😄

No. Interestingly some calc() methods leak into my final CSS from my theme ( bootstrap 5 based) . but not anything that has to do with typed - that's just "pure" css & animation keyframes.

[brandonmcconnell]

Sweet! Thanks for opening the PR. I'll take a look in the next couple of days and merge it.

[brandonmcconnell]

I'm hitting the below error when testing locally with that change. Do you know a safe way to add that calc so it only applies the calc for dart sass without affecting LibSass? Generally, I'd like to move it all to dartsass. I just have many people who use it for codepen, which only supports LibSass as of now.

@codepen @chriscoyier Is there a fix coming for this? LibSass is officially deprecated, and yet, many of us who are building Sass/SCSS products on CodePen are forced to either use LibSass since it's the only version supported on CodePen or develop elsewhere.

If it's a matter of it being a breaking change, could you keep the old LibSass versions of Sass and SCSS but re-label them LibSass Sass (deprecated) and LibSass SCSS (deprecated) accordingly and include new items for Sass and SCSS using the latest Dart Sass implementations?

I also opened an official support request for this in case that makes it easier to track this issue on your end, since I couldn't find a related issue board on GitHub.

[brandonmcconnell]

@nex3 I saw the workaround you mentioned last year, which seems ideal for my use case as well, except that it requires using multiple files, where my package is a monofile package. Is there a way to achieve the same result using a single file. Otherwise, I'll probably need to maintain two different versions of my package and make changes across both every time a new version is released.

Or alternatively, is there a way to code in Dart Sass and then compile to both Dart Sass and LibSass so the LibSass can be auto-generated by the Dart Sass, or the other way around? Not sure how interoperable those are.

[chriscoyier]

@codepen @chriscoyier Is there a fix coming for this? LibSass is officially deprecated, and yet, many of us who are building Sass/SCSS products on CodePen are forced to either use LibSass since it's the only version supported on CodePen or develop elsewhere.

CodePen is on DartSass 1.32.0. I know that's behind, but It's not LibSass. We'd like to upgrade higher, and will, it's just the API has breaking changes since then and we've had trouble with in relation to all the other stuff we need to support (stuff around importers / importPath).

[konung]

I'm hitting the below error when testing locally with that change. Do you know a safe way to add that calc so it only applies the calc for dart sass without affecting LibSass? Generally, I'd like to move it all to dartsass. I just have many people who use it for codepen, which only supports LibSass as of now.

Short of keeping 2 files - LibSass & DartSass, as you suggested, I don't have any working ideas :(

[brandonmcconnell]

@chriscoyier Thanks for clarifying. I think the main difference I noticed is that much of the new syntax from the past 3 years or so since they introduced the OOP-style syntax isn't yet supported. Whenever your team can find time for this, it would be greatly appreciate, however, I understand you all have lots on your plate. 🙏🏼

@nex3 offered a workaround that will work for my particular use case for the time being. Thank you, Natalie! 💯

[brandonmcconnell]

@konung I'm commenting in your PR with a reliable workaround @nex3 came up with. Small change 🙌🏼