Search code examples
reactjssass

scss styles not working in React version 18.2.0


I just created a new react project (version 18.2.0) and installed scss but it doesnt seem to actually work

package.json

  "dependencies": {
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^6.14.0",
    "react-scripts": "^1.1.5",
    "web-vitals": "^2.1.4"
  },
  "devDependencies": {
    "sass": "^1.63.6",
    "scss": "^0.2.4"
  }

Here is my import

import "../../styles/components/navigation/Navbar.scss";

Solution

  • I barely realized that I asked this a while ago, and I now have a answer that works for me, if I install it like this npm i sass --save-dev it works perfectly (I don't know why it doesn't work like without --save-dev though, so if you know plz leave a comment)