4

I am trying to build react app and I want to use scss to style my app.

Challenge is that even though I already installed node-sass, but I still get this error.

./src/styles/styles.scss (/usr/local/lib/node_modules/react-scripts/node_modules/css-loader/dist/cjs.js??ref--6-oneOf-5-1!/usr/local/lib/node_modules/react-scripts/node_modules/postcss-loader/src??postcss!/usr/local/lib/node_modules/react-scripts/node_modules/resolve-url-loader??ref--6-oneOf-5-3!/usr/local/lib/node_modules/react-scripts/node_modules/sass-loader/dist/cjs.js??ref--6-oneOf-5-4!./src/styles/styles.scss)
To import Sass files, you first need to install node-sass.
Run `npm install node-sass` or `yarn add node-sass` inside your workspace.
Require stack:
- /usr/local/lib/node_modules/react-scripts/node_modules/sass-loader/dist/getDefaultSassImplementation.js
- /usr/local/lib/node_modules/react-scripts/node_modules/sass-loader/dist/getSassImplementation.js
- /usr/local/lib/node_modules/react-scripts/node_modules/sass-loader/dist/index.js
- /usr/local/lib/node_modules/react-scripts/node_modules/sass-loader/dist/cjs.js
- /usr/local/lib/node_modules/react-scripts/node_modules/loader-runner/lib/loadLoader.js
- /usr/local/lib/node_modules/react-scripts/node_modules/loader-runner/lib/LoaderRunner.js
- /usr/local/lib/node_modules/react-scripts/node_modules/webpack/lib/NormalModule.js
- /usr/local/lib/node_modules/react-scripts/node_modules/webpack/lib/NormalModuleFactory.js
- /usr/local/lib/node_modules/react-scripts/node_modules/webpack/lib/Compiler.js
- /usr/local/lib/node_modules/react-scripts/node_modules/webpack/lib/webpack.js
- /usr/local/lib/node_modules/react-scripts/scripts/start.js

I also tried to delete node_modules and reinstalled node-sass but it didn't work. Any advice?

3 Answers 3

3

This happens to me sometimes and seems like issue with npm. Try installing node-sass using yarn

yarn add node-sass
Sign up to request clarification or add additional context in comments.

Comments

2

I'm not going to answer this question directly!

But point to an important matter! node-sass is deprecated!

sass package is used now in react-scripts. And the whole sass compiler or pre-processor is followed in the Dart sass project!

sass package is a distribution of Dart sass!

You can check more details and illustration in the following answer:

https://stackoverflow.com/a/68327656/7668448

Comments

1

This really seems like issue with npm (it happend not always), but if you already use npm to your project, it would be better to use:

npm cache clear --force

instead of relocating all dependencies on yarn.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.