Search code examples
cssnode.jsreactjsmodulenode-sass

React-App crashed due to node-sass error | TypeError: fs.existsSync is not a function

I have been working on my application for the past few months and it was working fine with node-sass installed until I came up with the following error with node-sass module itself today. enter image description here

I tried debugging with upgrading node-sass to version-5, installed sass-loader tried everything to no avail so far. The error still persists.

My Package.json file:

{
 "name": "giftshop2",
 "version": "0.1.0",
 "private": true,
 "dependencies": {
 "@testing-library/jest-dom": "^4.2.4",
 "@testing-library/react": "^9.3.2",
"@testing-library/user-event": "^7.1.2",
"firebase": "^7.23.0",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-router-dom": "^5.2.0",
"react-scripts": "^4.0.0",
"sass-loader": "^10.0.5"
},
 "scripts": {
 "start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
  ">0.2%",
  "not dead",
  "not op_mini all"
],
"development": [
  "last 1 chrome version",
  "last 1 firefox version",
  "last 1 safari version"
]
}
}

Any help would be highly appreciated.

Solution

  • I have just figured out that the problem is not with node-sass, I have accidentally imported render from node-sass in one of my components and this was breaking my whole application. And when I commented it my app started to work again. After 4 hours I found that how silly mistake it was :)

    enter image description here

    I am keeping my question open and not delete it, in case someone goes through the same problem, this will be helpful.

    Thanks