feat: Remove deprecated node-sass package, migrated to Sass #2392

[luckyklyist]

This PR addresses issue #2392.

Changes Made: #2392

• Removed the deprecated "node-sass" package.
• Added the "sass" package as a replacement.

Details:

In this PR, I've removed the deprecated "node-sass" package and replaced it with the "sass" package, which is the recommended alternative. This update ensures that we are using the latest and supported Sass compiler.

To migrate the deprecated "node-sass" syntax code to the new "sass" syntax, I used the Sass Migrator, which automates the migration process.

• has no linting errors (npm run lint)
• has no test errors (npm run test)
• is from a uniquely-named feature branch and is up to date with the develop branch.
• is descriptively named and links to an issue number, i.e. Fixes #2392

[welcome]

🎉 Thanks for opening this pull request! Please check out our contributing guidelines if you haven't already.

[lindapaiste]

🥇 Just wanted to say that this is a very good PR! You've explained what you changed and why/how. Much appreciated.

[luckyklyist]

🥇 Just wanted to say that this is a very good PR! You've explained what you changed and why/how. Much appreciated.

Thanks for the praise! It's greatly appreciated! Looking forward to your review and the PR getting merged!

[luckyklyist]

@lindapaiste I have removed the sass-migrator from the package.json scripts .

[luckyklyist]

hey @lindapaiste is there any other things to change in this pr ?

[lindapaiste]

This is looking great! I just ran the branch and had no problems running in dev.

There is one tiny thing to address which is the docker scripts, where we have an npm rebuild node-sass command.

p5.js-web-editor/Dockerfile

Line 13 in ca74574

RUN npm rebuild node-sass

p5.js-web-editor/Dockerfile

Line 30 in ca74574

RUN npm rebuild node-sass

I'm not sure what's the correct thing to put here when using Dart Sass. I think nothing? Like we delete those lines with no replacement? Do you know?

[luckyklyist]

I don't think there is rebuild command for the Dart Sass as it doesn't rely on native add-ons .I have remove the node-sass rebuild command from the dockerFile .

[lindapaiste]

@raclim this looks good to me but I’m a little bit scared to merge it as it has the potential to break the built process.

[lindapaiste]

@raclim I fixed all the conflicts so I'm going to go ahead and merge this in.

[raclim]

@lindapaiste Thanks so much for getting this in!

[lindapaiste]

@raclim just a heads up that we may have some pending PRs using the old syntax for the rem font size. When merging those, we'll want to change #{20 / $base-font-size}rem; etc to #{math.div(20, $base-font-size)}rem;. I think the older syntax will still work but it's now deprecated.