Replace Node-Sass with Dart-Sass in Create React App v3.x

Viewed 26122

Has anybody done this successfully yet? I currently have node-sass installed in my CRA project and I'm trying to replace it with dart-sass but am experiencing difficulty because the CRA error output is telling me that I need to have node-sass installed. Is there any way to let the underlying CRA config know to use my installed dart-sass package instead of node-sass?

enter image description here

3 Answers

There is this closed issue on CRA repository, so you probably can easily migrate from node-sass to Dart Sass just running a few commands.

First of all check your yarn.lock or package-lock.json to know if the version of the sass-loader that your react-scripts depends on is 7.2.0 or later.

If so, all that you need is run the following commands:

yarn remove node-sass
yarn add sass

In my case after that I had to remove the node_modules directory and ran the yarn install again due to an issue stating the app.

Notes:

If you are using npm > 6.9 you can create an alias like so

npm install node-sass@npm:sass

it will install dart-sass and you will be able to keep your CRA configuration.

I had success with:

npm uninstall node-sass
npm install ci
Related