Ik heb een leeg React-project gemaakt met het commando: npx create-react-app
op npm v7.0.7 en Node v15.0.1
Geïnstalleerd:
- Reageren v17.0.1,
- node-sass v5.0.0,
Vervolgens probeerde ik een leeg .scss-bestand te importeren in de app-component:
App.js
import './App.scss'
function App() {
return (
<div className="App">
App
</div>
);
}
export default App;
Geef een fout:
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.
pakket.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"
},
...
}
}
Antwoord 1, autoriteit 100%
TL;DR
npm uninstall node-sass
npm install [email protected]
Of, als u garen gebruikt (standaard in nieuwere CRA-versies)
yarn remove node-sass
yarn add [email protected]
Edit2: sass-loader v10.0.5lost het op. Het probleem is dat je het misschien niet gebruikt als een projectafhankelijkheid, maar meer als een afhankelijkheid van je afhankelijkheden. CRA gebruikt een vaste versie, angular-cli locks naar node-sass v4 enzovoort.
De aanbeveling voor nu is: als je alleen node-sass installeert, controleer dan de onderstaande tijdelijke oplossing (en de opmerking). Als je aan een leeg project werkt en je kunt je webpack-configuratie beheren (geen CRA of een CLI gebruiken om je project te ondersteunen), installeer dan de nieuwste sass-loader.
Bewerken: deze fout komt van sass-loader . Er is een mismatch omdat node-sass @latest v5.0.0 is en sass-loader ^4.0.0 verwacht.
Er is een openstaand probleem in hun repository met een bijbehorende oplossing die moet worden beoordeeld. Raadpleeg tot die tijd de onderstaande oplossing.
Tussenoplossing: installeer node-sass 5.0.0 nog niet (de hoofdversie is zojuist gestoten).
Node-sass verwijderen
npm uninstall node-sass
Installeer vervolgens de nieuwste versie (vóór 5.0)
npm install [email protected]
Opmerking: LibSass (vandaar ook node-sass) is verouderden dart-sass is de aanbevolen implementatie. U kunt in plaats daarvan sass
gebruiken, een knooppuntdistributie van dart- sass gecompileerd naar puur JavaScript.
Wees echter gewaarschuwd:
Wees voorzichtig met deze aanpak. React-scripts gebruikt sass-loader v8, die de voorkeur geeft aan node-sass boven sass (die een bepaalde syntaxis heeft die niet wordt ondersteund door node-sass). Als beide zijn geïnstalleerd en de gebruiker met sass heeft gewerkt, kan dit leiden tot fouten bij de css-compilatie
Antwoord 2, autoriteit 8%
De enige reden waarom u zo’n foutmelding krijgt, is dat uw node-versie niet compatibel is met uw node-sass-versie.
Dus zorg ervoor dat je de documentatie hier bekijkt: https://www.npmjs.com /package/node-sass
Of deze afbeelding hieronder zal u helpen, wat de node-versie de node-sass-versie kan gebruiken.
Bijvoorbeeld,als u node versie 12gebruikt in uw Windows (“misschien”), dan zou u de node-versie moeten installeren sass versie 4.12.
npm install [email protected]
Ja, zo. U hoeft nu dus alleen de node-sass-versie te installeren die wordt aanbevolen door het node-sass-team met de nodes op uw computer geïnstalleerd.
Antwoord 3, autoriteit 5%
Node-sass verwijderen
npm uninstall node-sass
gebruik sassdoor:
npm install -g sass
npm install --save-dev sass
Antwoord 4, autoriteit 3%
node-sass
ook bekend als LibSassis officieel beëindigd met ingang van 26 oktober 2020en in plaats daarvan moet je sass
ook wel Dart Sassgebruiken.
Voor npm
kunt u het volgende doen:
npm uninstall node-sass
npm install sass --save-dev
Voor yarn
:
yarn remove node-sass
yarn add sass
Antwoord 5
Als u CRA gebruikt met standaard yarn
pakketbeheerder, gebruik dan het volgende. Werkte voor mij.
yarn remove node-sass
yarn add [email protected]
Antwoord 6
Npm gebruiken,
npm uninstall node-sass
npm install node-sass
- verander de
"react-scripts": "4.0.0"
in"react-scripts": "4.0.3"
in het pakket .jsonen opslaan npm install
npm start
of, met garen –
yarn remove node-sass
yarn add --dev node-sass
- zoals hierboven
yarn install
yarn start
Antwoord 7
Het werkte voor mij na het toevoegen van een bepaalde versie van het node-sass-pakket ([email protected])
Antwoord 8
de beste oplossing voor mij was het verwijderen van node sass.
npm uninstall node-sass
installeer vervolgens sass
npm install sass
voor degenen die garen gebruiken
yarn remove node-sass
yarn add sass
Antwoord 9
Dit is een versieprobleem, installeer de juiste afhankelijke versie
npm uninstall node-sass
npm install [email protected]
Antwoord 10
Als de fout is
Fout: Node Sass-versie 5.0.0 is niet compatibel met ^4.0.0
Stap1: stop de server
Stap2: uitvoeringsopdrachten zijn npm uninstall node-sass
Stap3: controleer node-sass in package.json
als node-sass beschikbaar is in het bestand en voer Step2 opnieuw uit.
Stap4: npm install [email protected]
<=== opdracht uitvoeren
Stap5: wacht tot de opdracht succesvol is uitgevoerd.
Stap6: start-server met npm start
Antwoord 11
Kleine update: als je onderstaande foutmelding krijgt met betrekking tot node-sass, volg dan de onderstaande stappen.
code EPERM
npm ERR! syscall ontkoppelen
stappen om het probleem op te lossen:
- sluit visuele studio
- verwijder .node-sass.DELETE handmatig uit node_modules
- open visuele studio
- npm cache verifiëren
- npm install [email protected]
Antwoord 12
Verander gewoon de versie in:
“version”: “4.14.1” in uw package.json-bestand
Antwoord 13
Het toevoegen van sass-loader als dev-afhankelijkheid loste dit voor mij op.
“devDependencies”: { “node-sass”: “^6.0.0”, “sass-loader”: “^11.1.1” }
Antwoord 14
Deze fout treedt op wanneer versies van NodeJS en Node Sass niet overeenkomen.
u kunt uw probleem als volgt oplossen:
– Stap 1: verwijder Nodejs van uw computer
– Stap 2: installeer Nodejs versie 14.15.1 opnieuw.
– Stap 3: verwijder Node sass door het commando npm uninstall node-sass
uit te voeren
– Stap 4: installeer Node sass versie 4.14.1 opnieuw door het commando npm install [email protected]
uit te voeren
Na alle stappen kunt u het commando ng serve -o
uitvoeren om uw toepassing uit te voeren.
Node sass versie 5.0. 0 is niet compatibel met ^4.0.0.
Antwoord 15
Stappen om dit probleem op te lossen:
- Ga naar je node_module en open node-sass-modules.
2 Wijzig in package.json in node-sass de versie van “5.0.0” in “4.14.1”.
3 Eindelijk in de package.json in de root van het hoofdproject verander node-sass versie opnieuw van “5.0.0” naar “4.14.4.”
Dit zou moeten werken.