Search code examples
reactjssasscreate-react-appnode-sasssass-loader

Node Sass version 6.0.0 is incompatible with ^4.0.0 || ^5.0.0 in React.js

I tried to install sass-loader to compile scss, but it shows a version compatibility error. I downgrade the version and did so many things, but still shows the same issue.

React version- 17.0.2 node version- 16.2.0 npm version - 7.13.0

Package.json

  "dependencies": {
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "antd": "^4.16.2",
    "node-sass": "^4.14.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-redux": "^7.2.4",
    "react-scripts": "4.0.3",
    "redux-saga": "^1.1.3",
    "web-vitals": "^1.0.1"
  },

enter image description here

Solution

  • The error seems to come from a version of sass-loader that doesn't handle node-sass@6.

    It has been fixed in [email protected] by this pull request.

    Also note that if you use node@16, you will have to use node-sass@6 (see node-sass version policy)

    To sum up: You can use node-sass@6 given you also install a recent sass-loader version.