Erreur : Node Sass version 5.0.0 est incompatible avec ^4.0.0

Question

J'ai créé un projet React vierge, en utilisant la commande : npx create-react-app sur npm v7.0.7 et Node v15.0.1

Installé :

• React v17.0.1,
• node-sass v5.0.0,

J'ai ensuite essayé d'importer un fichier .scss vierge dans le composant App :

App.js

import './App.scss'

function App() {
  return (
    <div className="App">
      App
    </div>
  );
}

export default App;

Lancer une erreur :

Failed to compile.

./src/App.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/s
ass-loader/dist/cjs.js??ref--5-oneOf-6-4!./src/App.scss)
Error: Node Sass version 5.0.0 is incompatible with ^4.0.0.

paquet.json

{
  "name": "react-17-node-sass-5",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.11.5",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "node-sass": "^5.0.0",
    "react": "^17.0.1",
    "react-dom": "^17.0.1",
    "react-scripts": "4.0.0",
    "web-vitals": "^0.2.4"
  },
 ...

  }
}

Answer 1

Petite mise à jour : Si vous obtenez l'erreur ci-dessous en ce qui concerne node-sass, suivez les étapes indiquées ci-dessous.

code EPERM
npm ERR ! syscall unlink

les étapes à suivre pour résoudre le problème :

1. fermer le studio visuel
2. supprimer manuellement .node-sass.DELETE de node_modules
3. open visual studio
4. npm cache verify
5. npm install node-sass@4.14.1

Answer 2

Il suffit de changer la version en : "version" : "4.14.1" dans votre fichier package.json.

Answer 3

L'ajout de sass-loader en tant que dépendance de développement a résolu le problème pour moi. "devDependencies" : { "node-sass" : "^6.0.0", "sass-loader" : "^11.1.1" }

Answer 4

Cette erreur se produit lorsque les versions de NodeJS et de Node Sass ne correspondent pas.

vous pouvez résoudre votre problème en procédant comme suit :

- Étape 1 : Supprimer Nodejs de votre ordinateur

- Étape 2 : Réinstaller Nodejs version 14.15.1.

- Étape 3 : Désinstaller Node sass en exécutant la commande npm uninstall node-sass

- Étape 4 : Réinstallez Node sass version 4.14.1 en lançant la commande npm install node-sass@4.14.1

Après toutes ces étapes, vous pouvez lancer la commande ng serve -o pour exécuter votre application.

Node sass version 5.0.0 est incompatible avec ^4.0.0.

Answer 5

Mesures à prendre pour résoudre ce problème :

1. Allez dans votre node_module et ouvrez les modules node-sass.

2 Dans le package.json de node-sass, changez la version de "5.0.0" à "4.14.1".

3 Enfin, dans le package.json à la racine du projet principal, changez à nouveau la version de node-sass de "5.0.0" à "4.14.4".

Cela devrait fonctionner.