Create-react-app: SASS_PATH=node_modules:src doesn't work

[frederikhors]

I'm trying to use as stated in https://facebook.github.io/create-react-app/docs/adding-a-sass-stylesheet

• file .env:

...
SASS_PATH=node_modules:src
...

• file src/styles/index.scss:

@import "bootstrap/scss/bootstrap";

It gives me this error:

Failed to compile.

./src/styles/index.scss (./node_modules/css-loader??ref--6-oneOf-5-1!./node_modules/postcss-loader/src??postcss!./node_modules/sass-loader/lib/loader.js??ref--6-oneOf-5-3!./src/styles/index.scss)
@import "bootstrap/scss/bootstrap";
^
      File to import not found or unreadable: bootstrap/scss/bootstrap.

If I use below (with ~) it works:

• file src/styles/index.scss:

@import "~bootstrap/scss/bootstrap";

• package.json:

  "dependencies": {
    "@types/jest": "23.3.13",
    "@types/node": "10.12.20",
    "@types/react": "16.7.22",
    "@types/react-router": "4.4.3",
    "@types/react-router-dom": "4.3.1",
    "@types/react-dom": "16.0.11",
    "bootstrap": "4.2.1",
    "node-sass": "4.11.0",
    "react": "16.7.0",
    "react-dom": "16.7.0",
    "react-router": "4.3.1",
    "react-router-dom": "4.3.1",
    "react-scripts": "2.1.3",
    "typescript": "3.2.4"
  },
  "devDependencies": {
    "source-map-explorer": "1.6.0"
  },

[mrmckeb]

Hi @frederikhors, it looks like you haven't completed the issue template, which makes this very hard to resolve. If you can please supply the requested information, we can take a look at this for you.

[Andy2K11]

From the documentation for material-components it looks like the .env entry needs to be:

SASS_PATH=./node_modules

If this works for you then it's probably just a correction to the documentation that's needed.

I had the same problem and it's fixed for me now.

[Andy2K11]

One quick follow on thought I had about this was that I'm not sure if my solution is cross platform.

Was this the intent behind the original method?

SASS_PATH=node_modules:src

As it happens, I am on Windows but use the linux syntax with Git Bash set as my IDE shell. hth

[vimalraj9423]

I HAVE SAME PROBLEM. ANY SUGGESTION PLEASE...

[SandHilt]

SASS_PATH=node_modules works for me.

[frederikhors]

On Windows you have to use ./node_modules.

[iansu]

We should probably mention that in the docs. Would you like to submit a PR?

[SamMade]

also @iansu can you include in the documentation that you need a semicolon instead of a colon on windows environments

SASS_PATH=./node_modules;./src

https://technology.customink.com/blog/2014/10/09/understanding-and-using-sass-load-paths/#where-sass-is-headed

[monish001]

Just created a PR with the fix in the documentation. Please review.