Node Sass version 6.0.0 is incompatible with ^4.0.0 || ^5.0.0. #3103

semihraifgurel · 2021-05-10T07:29:44Z

NPM version (npm -v):
7.12.0
Node version (node -v):
16.0.1
Node Process (node -p process.versions):
{
node: '16.1.0',
v8: '9.0.257.24-node.11',
uv: '1.41.0',
zlib: '1.2.11',
brotli: '1.0.9',
ares: '1.17.1',
modules: '93',
nghttp2: '1.42.0',
napi: '8',
llhttp: '6.0.1',
openssl: '1.1.1k+quic',
cldr: '39.0',
icu: '69.1',
tz: '2021a',
unicode: '13.0',
ngtcp2: '0.1.0-DEV',
nghttp3: '0.1.0-DEV'
}
Node Platform (node -p process.platform):
darwin
Node architecture (node -p process.arch):
x64
node-sass version (node -p "require('node-sass').info"):
node-sass 6.0.0 (Wrapper) [JavaScript]
libsass 3.5.5 (Sass Compiler) [C/C++]
npm node-sass versions (npm ls node-sass):
theme-landing@0.1.0 /Users/semihraifgurel/GitHub.noindex/theme-landing
├── node-sass@6.0.0
└─┬ react-scripts@4.0.3
└─┬ sass-loader@10.1.1
└── node-sass@6.0.0 deduped invalid

npm ERR! code ELSPROBLEMS
npm ERR! invalid: node-sass@6.0.0 /Users/semihraifgurel/GitHub.noindex/theme-landing/node_modules/node-sass

npm ERR! A complete log of this run can be found in:
npm ERR! /Users/semihraifgurel/.npm/_logs/2021-05-10T07_38_04_899Z-debug.log
semihraifgurel@Semih-MacBook-Pro theme-landing %

The text was updated successfully, but these errors were encountered:

leonardcser · 2021-05-10T09:06:59Z

Same issue here.

NPM version:
7.10.0
Node version
v16.0.0
Node Process:
{
node: '16.0.0',
v8: '9.0.257.17-node.10',
uv: '1.41.0',
zlib: '1.2.11',
brotli: '1.0.9',
ares: '1.17.1',
modules: '93',
nghttp2: '1.43.0',
napi: '8',
llhttp: '6.0.0',
openssl: '1.1.1k',
cldr: '39.0',
icu: '69.1',
tz: '2021a',
unicode: '13.0'
}
Node Platform:
darwin
Node architecture:
x64
node-sass version:
node-sass 6.0.0 (Wrapper) [JavaScript]
libsass 3.5.5 (Sass Compiler) [C/C++]
npm node-sass versions:
frontend@0.1.0 /Users/leo/dev/Python/project/frontend
├── node-sass@6.0.0
└─┬ react-scripts@4.0.3
└─┬ sass-loader@10.1.1
└── node-sass@6.0.0 deduped invalid

npm ERR! code ELSPROBLEMS
npm ERR! invalid: node-sass@6.0.0 /Users/leo/dev/Python/project/frontend/node_modules/node-sass

npm ERR! A complete log of this run can be found in:
npm ERR! /Users/leo/.npm/_logs/2021-05-10T09_05_18_799Z-debug.log

React Complie Log:
Failed to compile.

./src/styles/_global.scss (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-6-1!./node_modules/postcss-loader/src??postcss!./node_modules/resolve-url-loader??ref--5-oneOf-6-3!./node_modules/sass-loader/dist/cjs.js??ref--5-oneOf-6-4!./src/styles/_global.scss)
Node Sass version 6.0.0 is incompatible with ^4.0.0 || ^5.0.0.

xzyfer · 2021-05-10T09:10:14Z

sass-loader requires node-sass 4 or 5.
https://github.com/webpack-contrib/sass-loader/blob/master/package.json#L43

camiblanch · 2021-05-12T23:01:54Z

As of 2 days ago, sass-loader is compatible with node-sass 4, 5, or 6. webpack-contrib/sass-loader#947

You should be able to update sass-loader to get this compatibility

duc-gp · 2021-05-14T13:48:04Z

I dont have sass-loader as a dependency in my project (used a fresh create react app) and followed the steps on https://create-react-app.dev/docs/adding-a-sass-stylesheet/

and got this error

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

saper · 2021-05-14T21:11:57Z

@duc-talentwunder create-react-app adds sass-loader to webpack configuration so I believe this is the same problem

https://github.com/facebook/create-react-app/blob/fddce8a9e21bf68f37054586deb0c8636a45f50b/packages/react-scripts/config/webpack.config.js#L585

tanapaydin · 2021-05-15T20:45:35Z

Adding sass-loader as as dev-dependency solved this for me.
"devDependencies": { "node-sass": "^6.0.0", "sass-loader": "^11.1.1" }

luciomartinez · 2021-05-18T17:20:04Z

@duc-talentwunder create-react-app adds sass-loader to webpack configuration so I believe this is the same problem

https://github.com/facebook/create-react-app/blob/fddce8a9e21bf68f37054586deb0c8636a45f50b/packages/react-scripts/config/webpack.config.js#L585

That's correct. It's unfortunate that is not easy to upgrade it for react-scripts.

scott-schibli · 2021-05-20T17:58:20Z

Adding sass-loader as as dev-dependency solved this for me.
"devDependencies": { "node-sass": "^6.0.0", "sass-loader": "^11.1.1" }

For me "sass-loader" only goes to version "^8.0.2". Am I missing something here? Im implementing scss into a Create React App & Typescript build.

Edely · 2021-05-23T04:59:16Z

Adding sass-loader as as dev-dependency solved this for me.
"devDependencies": { "node-sass": "^6.0.0", "sass-loader": "^11.1.1" }

@tanapaydin is right, but I also had to erase the node_modules folder and the lock file to work.

mdart86 · 2021-05-23T09:38:13Z

Hey @Edely - thank you, can I clarify, which node_modules folder?
I can't see a lock file here though

mdart86 · 2021-05-23T09:45:58Z

For those of you who want a workaround... I have downgraded to Version 5... I will let you know if I encounter any major issues

Edely · 2021-05-23T11:04:13Z

Hey @Edely - thank you, can I clarify, which node_modules folder?
I can't see a lock file here though

@mdart86 In my case was the node_modules from the whole project, which usually stays at the root folder.

srmasharad · 2021-05-25T07:58:52Z

Adding sass-loader as as dev-dependency solved this for me.
"devDependencies": { "node-sass": "^6.0.0", "sass-loader": "^11.1.1" }

For me "sass-loader" only goes to version "^8.0.2". Am I missing something here? Im implementing scss into a Create React App & Typescript build.

I also tried the same thing but I still get the error
Node Sass version 6.0.0 is incompatible with ^4.0.0 || ^5.0.0.

IN25 · 2021-05-25T17:01:55Z

For anyone looking for how to fix:
Delete package-lock.json
Delete node_modules
in the terminal run npm install or yarn install

fauziagustian · 2021-05-25T20:03:47Z

For anyone looking for how to fix:
Delete package-lock.json
Delete node_modules
in the terminal run npm install or yarn install

i have same error , and do it your suggest, but its same when open app:
Node Sass version 6.0.0 is incompatible with ^4.0.0 || ^5.0.0.

AustinB12 · 2021-05-26T15:29:33Z

For anyone looking for how to fix:
Delete package-lock.json
Delete node_modules
in the terminal run npm install or yarn install

I tried this as well and still got the same error. 😢

shees-usman · 2021-05-26T19:48:29Z

Running into the same issue. I can't install new dependencies until I update electron, once I updated electron during the install node-sass started crying out. Now stuck with the case where node-sass doesn't work. Keeps saying:

Error: Node Sass version 6.0.0 is incompatible with ^4.0.0.

t-pyrope · 2021-05-28T07:17:32Z

I installed the last version of sass-loader by npm install sass-loader@latest and reloaded the page and that solved the problem to me

aminnoura · 2021-05-28T10:45:12Z

I am using

"sass-loader": "^11.1.1",
"node-sass": "^6.0.0",

and still getting error:
Error: Node Sass version 6.0.0 is incompatible with ^4.0.0.

Already deleted node_modules and lock file and installed everything again.

aminnoura · 2021-05-28T10:49:47Z

Find a solution:

yarn add css-loader
yarn add react-script

updating css-loader and react-script fixed my issue.

TorvaldsDB · 2021-05-28T13:25:28Z

Adding sass-loader as as dev-dependency solved this for me.
"devDependencies": { "node-sass": "^6.0.0", "sass-loader": "^11.1.1" }

@tanapaydin is right, but I also had to erase the node_modules folder and the lock file to work.

thank you very much!

okechukwu0127 · 2021-05-28T15:50:17Z

NPM version (npm -v):
7.12.0

Node version (node -v):
16.0.1

Node Process (node -p process.versions):
{
node: '16.1.0',
v8: '9.0.257.24-node.11',
uv: '1.41.0',
zlib: '1.2.11',
brotli: '1.0.9',
ares: '1.17.1',
modules: '93',
nghttp2: '1.42.0',
napi: '8',
llhttp: '6.0.1',
openssl: '1.1.1k+quic',
cldr: '39.0',
icu: '69.1',
tz: '2021a',
unicode: '13.0',
ngtcp2: '0.1.0-DEV',
nghttp3: '0.1.0-DEV'
}

Node Platform (node -p process.platform):
darwin

Node architecture (node -p process.arch):
x64

node-sass version (node -p "require('node-sass').info"):
node-sass 6.0.0 (Wrapper) [JavaScript]
libsass 3.5.5 (Sass Compiler) [C/C++]

npm node-sass versions (npm ls node-sass):
theme-landing@0.1.0 /Users/semihraifgurel/GitHub.noindex/theme-landing
├── node-sass@6.0.0
└─┬ react-scripts@4.0.3
└─┬ sass-loader@10.1.1
└── node-sass@6.0.0 deduped invalid

npm ERR! code ELSPROBLEMS
npm ERR! invalid: node-sass@6.0.0 /Users/semihraifgurel/GitHub.noindex/theme-landing/node_modules/node-sass

npm ERR! A complete log of this run can be found in:
npm ERR! /Users/semihraifgurel/.npm/_logs/2021-05-10T07_38_04_899Z-debug.log
semihraifgurel@Semih-MacBook-Pro theme-landing %

Error: Node Sass version 5.0.0 is incompatible with ^4.0.0. or node sass version 5.0.0 is incompatible with ^4.0.0

SOLUTION THAT WORKED FOR ME

with npm =>
1.npm uninstall node-sass
2.npm install node-sass@4.14.1
with yarn =>
1.yarn remove node-sass
2.yarn remove node-sass@4.14.1

Reomar · 2021-06-01T18:38:38Z

with npm =>
1.npm uninstall node-sass
2.npm install node-sass@4.14.1
with yarn =>
1.yarn remove node-sass
2.~~yarn remove node-sass@4.14.1~~

yarn add node-sass@4.14.1

tech-doctor · 2021-06-03T20:58:02Z

with npm =>
1.npm uninstall node-sass
2.npm install node-sass@4.14.1
with yarn =>
1.yarn remove node-sass
2.yarn remove node-sass@4.14.1

yarn add node-sass@4.14.1

This is not working for me., i am using the latest version of node.

daniel-flex · 2021-06-04T02:57:36Z

This is not working for me., i am using the latest version of node.

only works when node-sass is a top-level dependency, but not when it's installed as a module dependency, i.e. Create React App.

tech-doctor · 2021-06-04T07:33:46Z

This is not working for me., i am using the latest version of node.

only works when node-sass is a top-level dependency, but not when it's installed as a module dependency, i.e. Create React App.

Thanks Daniel. I do used Create React App to run my react projects, I used node-sass v14 which was working well with my initial version of Node, after updating my node to v16 some days ago, the node-sass stopped working, I've tried updating the node-sass to the latest version(v16) but I'm still getting the error.

davidkim10 · 2021-06-05T06:34:18Z

"devDependencies": {
    "node-sass": "^6.0.0",
    "sass-loader": "^12.0.0"
 }

Add dev dependencies
Delete package-lock.json or yarn.lock
Delete node modules
Run npm install or yarn install

CarlosRangel17 · 2021-10-27T20:02:09Z

@dsvgit Thank you for your latest post!! I tried updating to the latest node-sass version ^6.0.1 with sass-loader ^11.1.1; however, I kept seeing this error reported in the thread. I went ahead and tried your exact versions node-sass: ^6.0.0 and sass-loader: 10.2.0 and it worked perfectly!

PotLid · 2021-10-31T03:43:03Z

yarn add --exact react-scripts@4.0.3
worked for me. Node v16

This solved my issue. Super!

abhijitk7 · 2021-11-02T14:03:16Z

I was getting below error

node sass version 6.0.0 is incompatible with 4.0.0

performed below steps and it worked for me

with npm =>
1.npm uninstall node-sass
2.npm install node-sass@4.14.1

wangmeijian · 2021-11-04T06:24:20Z

delete yarn.lock
remove node_modules
yarn add node-sass@latest sass-loader@latest

GreatDseven · 2021-11-10T03:04:38Z

No se pudo instalar node-sass 4.14, en su lugar encontré que node-sass está en desuso, así que me muevo a dart-sass
correr
yarn remove node-sass
yarn add sass
npm uninstall node-sass
npm install sass

功能

功能

完美解决了我遇到的问题感谢感谢

hatamsoyunov · 2021-11-11T18:56:36Z

to fix it I had to remove node_modules and yarn.lock (not sure if it is ok for everyone) then I add to my package.json node-sass dependency
"devDependencies": {
  "node-sass": "^6.0.0"
}
not sure what exactly helped me that's really weird behaviour

I'm using react-scripts@4.0.3 and it requires sass-loader@^10.0.5 and after above actions I have sass-loader@10.2.0 installed in my node_modules which is allow to use node-sass@6.0.0 because in peerDependecies of this version I see "node-sass": "^4.0.0 || ^5.0.0 || ^6.0.0"

For CRA it was enough to update react-scripts 🤯
Thank you so much!

alejandro-fdez · 2021-11-18T17:51:58Z

For anyone looking for how to fix: Delete package-lock.json Delete node_modules in the terminal run npm install or yarn install

This worked for me. Note that if you use yarn, the lock file is called "yarn.lock".

parsadoc · 2021-11-23T09:15:04Z

node-sass is a deprecated lib
remove it then use [dart-sass](https://www.npmjs.com/package/dart-sass) (it's renamed to [sass](https://www.npmjs.com/package/dart-sass))

yarn remove node-sass
or
npm uninstall node-sass

then

yard add sass --dev
or
npm i sass --dev

it worked for me.

aramyesildeniz · 2021-11-25T10:09:55Z

Thats the correct answer.
node-sass is deprecated, you have to switch to sass

mateusloubach · 2021-12-02T16:16:43Z

npm uninstall node-sass;

npm install node-sass@4.14.1

solution above was found here:
https://stackoverflow.com/questions/62304283/src-index-scss-node-modules-css-loader-dist-cjs-jsref-6-oneof-5-1-node

answer provided by: carmen romero

omarrendon · 2021-12-09T17:15:42Z

The easy solution I found in this video: https://www.youtube.com/watch?v=7uLl4XvFlFs

npm uninstall node-sass

npm install sass

This work for me!! Thanks.

suliman-nm98 · 2021-12-18T12:26:53Z

Upgrade you sass loader and it should work smooth as butter!.

npm i sass-loader@latest

ivanoffbg · 2022-01-13T08:05:44Z

When I tried to compile my project with "yarn hot or yarn watch" I had the same error.
I fixed it like this:

yarn remove sass-loader
yarn remove node-sass
and after that I delete "node_modules" directory + package.lock file..
then:
yarn add sass-loader@^7.0.1 node-sass --dev

after that, you can run your project without problem :)

dembit · 2022-01-21T06:14:35Z

It helps me !!!

"node-sass": "^6.0.0",
"ssas-loader": "^10",

scurrilus · 2022-01-22T15:59:31Z

I had the same Issue. My solution was. Switch from node-sass to sass. After that it was not working. So i have also updated my old "react-scripts": "^3.4.1" to "react-scripts": "^5.0.0". And then magic, it works. I use this with node 16.8.

"sass": "^1.49.0", "sass-loader": "^10",

Zhangyao719 · 2022-05-29T15:13:17Z

Try this one. This combination solves my problem.
My node version: v16.15.0
"devDependencies": { "node-sass": "^6.0.0", "sass-loader": "^10.2.0", }
Version 11 of sass-loader is too new for webpack4 to cause other problems: 'this.getOptions is not a function'.

mr-chk · 2022-06-14T01:31:25Z

我在此视频中找到的简单解决方案： https ://www.youtube.com/watch?v=7uLl4XvFlFs

npm 卸载 node-sass

npm 安装 sass

有用的

godwintrav · 2022-08-03T19:48:55Z

The easy solution I found in this video: https://www.youtube.com/watch?v=7uLl4XvFlFs

npm uninstall node-sass

npm install sass

worked for me

cmiltone · 2022-10-15T19:06:50Z

Update react-scripts

mohamedmehdigara · 2022-12-15T07:03:22Z

Hello.

npm uninstall node-sass
npm install node-sass
Change react-scripts version in package.json to 4.0.3
npm install
npm start

sato-thuyetnguyen · 2023-12-28T07:43:29Z

yarn remove node-sass && yarn add sass
I'm using sass instead.

vivekv2k · 2024-06-01T17:18:11Z

First, you need to understand why this error is occurring. The reason is that node-sass is not compatible with your sass-loader, so you need to match the node-sass version with the sass-loader. First of all, check your Node.js version, and second, check your sass-loader and node-sass versions. For example:

Node.js version is 14
sass-loader is 7.1.0
node-sass is 4.14.1

Check each of the versions to ensure they match. If, for instance, your Node.js version is 20, your node-sass version is 9, but your sass-loader version is 7, you will encounter an error. In this case, you need to first ensure that the versions match and align each of the versions.

I hope this explanation will help someone who is searching for a solution.

xzyfer closed this as completed May 10, 2021

krashanoff mentioned this issue May 13, 2021

Bump node-sass from 5.0.0 to 6.0.0 uclaacm/TeachLAFrontend#515

Closed

kazbaig mentioned this issue May 27, 2021

Bump node-sass to v5 aws-samples/medical-transcription-analysis#73

Merged

vexuas mentioned this issue Dec 5, 2021

Add work in progress layout vexuas/apex-armor-swap#5

Merged

vexuas mentioned this issue Dec 12, 2021

Install node-sass vexuas/aura-kingdom-timers#3

Merged

inghylt mentioned this issue Jan 14, 2022

Update node-sass and sass-loader MetabolicAtlas/MetabolicAtlas#836

Closed

chinmaym07 mentioned this issue Feb 25, 2022

Update node-sass versions. EOS-uiux-Solutions/eos-icons-landing#60

Closed

nschonni mentioned this issue Jun 8, 2023

Node Sass version 9.0.0 is incompatible with ^4.0.0. #3369

Closed

angrave mentioned this issue Jun 17, 2023

Update package.json versions (Node / React / node-sass) classtranscribe/FrontEnd#625

Closed

sg-c mentioned this issue Jul 17, 2023

Replace node-sass with sass to get rid of the python@2 dependency beinan/presto-stats#2

Merged

striderkein mentioned this issue Sep 25, 2023

SCSS striderkein/eaglys-web#12

Open

Node Sass version 6.0.0 is incompatible with ^4.0.0 || ^5.0.0. #3103

Node Sass version 6.0.0 is incompatible with ^4.0.0 || ^5.0.0. #3103

Comments

semihraifgurel commented May 10, 2021 • edited Loading

leonardcser commented May 10, 2021 • edited Loading

xzyfer commented May 10, 2021

camiblanch commented May 12, 2021 • edited Loading

duc-gp commented May 14, 2021

saper commented May 14, 2021

tanapaydin commented May 15, 2021

luciomartinez commented May 18, 2021

scott-schibli commented May 20, 2021

Edely commented May 23, 2021

mdart86 commented May 23, 2021

mdart86 commented May 23, 2021 • edited Loading

Edely commented May 23, 2021 • edited Loading

srmasharad commented May 25, 2021

IN25 commented May 25, 2021 • edited Loading

fauziagustian commented May 25, 2021

AustinB12 commented May 26, 2021

shees-usman commented May 26, 2021

t-pyrope commented May 28, 2021 • edited Loading

aminnoura commented May 28, 2021

aminnoura commented May 28, 2021

TorvaldsDB commented May 28, 2021

okechukwu0127 commented May 28, 2021

Reomar commented Jun 1, 2021 • edited Loading

tech-doctor commented Jun 3, 2021

daniel-flex commented Jun 4, 2021

tech-doctor commented Jun 4, 2021

davidkim10 commented Jun 5, 2021

CarlosRangel17 commented Oct 27, 2021

PotLid commented Oct 31, 2021

abhijitk7 commented Nov 2, 2021

wangmeijian commented Nov 4, 2021

GreatDseven commented Nov 10, 2021

hatamsoyunov commented Nov 11, 2021 • edited Loading

alejandro-fdez commented Nov 18, 2021

parsadoc commented Nov 23, 2021

then

aramyesildeniz commented Nov 25, 2021

mateusloubach commented Dec 2, 2021

omarrendon commented Dec 9, 2021

suliman-nm98 commented Dec 18, 2021

ivanoffbg commented Jan 13, 2022 • edited Loading

dembit commented Jan 21, 2022

scurrilus commented Jan 22, 2022

Zhangyao719 commented May 29, 2022 • edited Loading

mr-chk commented Jun 14, 2022

godwintrav commented Aug 3, 2022

cmiltone commented Oct 15, 2022

mohamedmehdigara commented Dec 15, 2022

sato-thuyetnguyen commented Dec 28, 2023

vivekv2k commented Jun 1, 2024

semihraifgurel commented May 10, 2021 •

edited

Loading

leonardcser commented May 10, 2021 •

edited

Loading

camiblanch commented May 12, 2021 •

edited

Loading

mdart86 commented May 23, 2021 •

edited

Loading

Edely commented May 23, 2021 •

edited

Loading

IN25 commented May 25, 2021 •

edited

Loading

t-pyrope commented May 28, 2021 •

edited

Loading

Reomar commented Jun 1, 2021 •

edited

Loading

hatamsoyunov commented Nov 11, 2021 •

edited

Loading

ivanoffbg commented Jan 13, 2022 •

edited

Loading

Zhangyao719 commented May 29, 2022 •

edited

Loading