npm attempting to load wrong version of node-sass

Viewed 6390

I am upgrading a project to node-sass 4.9.4 because our previous version 3.13.1 is no longer supported and will result in a 404 if trying to load from github. The problem is whenever I try to do it, npm keeps attempting to load node-sass@3.13.1

I have tried to do npm install node-sass@4.9.4, npm install node-sass@4.9.3 and npm install node-sass@latest but it tries to load 3.13.1 every time resulting in the following error:

$ npm install node-sass@4.9.3

> node-sass@3.13.1 install D:\Projects\Repos\bluemill\mle-website\node_modules\gulp-sass\node_modules\node-sass
> node scripts/install.js

Downloading binary from https://github.com/sass/node-sass/releases/download/v3.13.1/win32-x64-57_binding.node
Cannot download "https://github.com/sass/node-sass/releases/download/v3.13.1/win32-x64-57_binding.node":

HTTP error 404 Not Found

Hint: If github.com is not accessible in your location
      try setting a proxy via HTTP_PROXY, e.g.

      export HTTP_PROXY=http://example.com:1234

or configure npm proxy via

      npm config set proxy http://example.com:8080

> node-sass@4.9.3 install D:\Projects\Repos\bluemill\mle-website\node_modules\node-sass
> node scripts/install.js

Downloading binary from https://github.com/sass/node-sass/releases/download/v4.9.3/win32-x64-57_binding.node
Download complete
Binary saved to D:\Projects\Repos\bluemill\mle-website\node_modules\node-sass\vendor\win32-x64-57\binding.node
Caching binary to C:\Users\Tyler\AppData\Roaming\npm-cache\node-sass\4.9.3\win32-x64-57_binding.node

> node-sass@3.13.1 postinstall D:\Projects\Repos\bluemill\mle-website\node_modules\gulp-sass\node_modules\node-sass
> node scripts/build.js

Other things I've tried:

  • Rebooting my computer
  • Restarting docker
  • Restarting git bash (I'm on windows)
  • Running npm cache clean --force
  • Going to the node-sass 4.9.4 npm-cache folder and manually downloading and installing binding
  • Setting "node-sass": "^4.9.0" in package.json for the correct folder
  • Setting "node-sass": { "version": "4.9.4"... in package-lock.json
  • Checked package.json and package-lock.json for duplicate node-sass requirements that might be set to a different version (there are no others)
  • Deleting the node_modules folder and running npm install again
  • Running npm rebuild node-sass

No matter what I do, it always tries to load 3.13.1 first and results in a 404 error. I am completely at a loss as to what I can try next. I have double checked that I am running the commands in the same directory as the correct package.json at least 5 times.

The first time I got the error I fixed the package.json and it worked, then I got an error when doing docker-compose up so I reran npm install to confirm it had all the modules, since then it only loads 3.13.1 no matter what I do.

5 Answers

Method 1:

sudo npm i -g node-gyp


sudo npm install node-sass --save-dev --unsafe-perm=true

sudo rm -rf node_modules && npm rebuild node-sass && npm i

Method 2:

sudo npm install --unsafe-perm -g node-sass

Recommended: Method 3

rm -rf ./node_modules
sudo rm package-lock.json 
sudo npm install --unsafe-perm

If you try to install only node-sass or laravel-mix

sudo npm install --unsafe-perm node-sass
sudo npm install --unsafe-perm laravel-mix

Use -g flag if you want to install globally:

sudo npm install --unsafe-perm -g node-sass
sudo npm install --unsafe-perm -g laravel-mix

I tried using rm -rf ./node_modules then npm install. For some reason this worked. I had previously deleted the folder manually but clicking delete, so I don't know if it was a mixture of other things I tried and this or if it was simply because I did it through code. Either way, it then loaded the 4.9.4 for node-sass

I had a similar problem. I had both global installations of sass and nested node projects. I fixed the problem by deleting node_modules in the project directory, the parent project, and the global installations in /usr/lib and /usr/bin. Then npm install everything from the top down. sass is very good at sourcing binaries from many different locations on your system. be sure to root them all out with find /usr -name *sass*.

Just;

  • remove package-lock.json
  • clear the npm cache (to be sure)
  • remove node-modules
  • perform npm install

It took me a day and over 20 procedures I have followed from stackoverflow, github etc.

I had the same problem in Laravel and this procedure worked for me.

I opened package.json file and update the following.

"laravel-mix": "^5.0.1",
    "sass": "^1.20.1",
    "sass-loader": "^8.0.0"

If you are experiencing the same problem in 2020, I think it will also work for you. Don't ignore laravel-mix since node-sass is it's dependency so you must update it also to the latest version. If you are using Laravel with Vue JS you can update all your dependencies to the latest version.

"axios": "^0.19",
    "bootstrap": "^4.0.0",
    "cross-env": "^7.0",
    "jquery": "^3.2",
    "laravel-mix": "^5.0.1",
    "lodash": "^4.17.13",
    "popper.js": "^1.12",
    "resolve-url-loader": "^2.3.1",
    "sass": "^1.20.1",
    "sass-loader": "^8.0.0",
    "vue": "^2.5.17",
    "vue-template-compiler": "^2.6.10"

now run npm install

Happy coding...

Related