facebook / create-react-app

Set up a modern web app by running one command.
https://create-react-app.dev
MIT License
102.81k stars 26.87k forks source link

Is it normal to receive a DEPRECATION WARNING if using sass and not node-sass? #13681

Closed JumpForJoy closed 1 month ago

JumpForJoy commented 1 month ago

Hello,

I have updated my react-scripts to version 4.0.3, and I wanted to replace node-sass with sass as well since it's been deprecated for some time. The thing now is that I receive a deprecation warning: "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". As far I understand one needs to use the modern api with sass-loader which has to be set in the webpack's config, but we don't have access to that in create-react-app: https://create-react-app.dev/docs/adding-a-sass-stylesheet https://sass-lang.com/documentation/breaking-changes/legacy-js-api/ https://webpack.js.org/loaders/sass-loader/#api So my question is how to use this modern api in order to let this deprecated staff go?

Thank you in advance.

mrandrewjbaker commented 1 month ago

You may need to look at your scss files. I had to convert mine from @import to @use and then some other minor issues with namespaces and variables, I just did @use 'path/to/file/' as *;

Hope this helps!

JumpForJoy commented 1 month ago

@mrandrewjbaker, thanks. So in other words you mean that changing those should make the compiler not use the old JS API?

mrandrewjbaker commented 1 month ago

https://sass-lang.com/documentation/at-rules/import/ Yes in order to clean up the deprecation warnings. They apparently have a script. I did a find and replace.

-- Since this is not purely CRA either, should probably close this issue.

JumpForJoy commented 1 month ago

Yes, thank you very much, @mrandrewjbaker. :)

JumpForJoy commented 1 month ago

Closing since it's not directly relevant to CRA as @mrandrewjbaker mentioned.