Can't Install Node-Sass@6 for Node V16

Can't Install Node-Sass@6 for Node V16

This is my package.json after uninstalling sass node-sass and sass-loader because I changed my node version from 14 to 16,

{
  "name": "our-awesome-project",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "dev": "nuxt",
    "build": "nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate",
    "static": "NUXTJS_DEPLOY_TARGET=static NUXTJS_SSR=true nuxt generate",
    "build-and-start": "NUXTJS_DEPLOY_TARGET=server NUXTJS_SSR=false nuxt build && NUXTJS_DEPLOY_TARGET=server NUXTJS_SSR=false nuxt start"
  },
  "husky": {
    "hooks": {
      "pre-commit": "cross-env PRE_COMMIT=true lint-staged -r"
    }
  },
  "dependencies": {
    "core-js": "^3.19.3",
    "nuxt": "^2.15.8",
    "nuxt-i18n": "^6.28.1",
    "nuxt-purgecss": "^1.0.0",
    "vue": "^2.6.14",
    "vue-server-renderer": "^2.6.14",
    "vue-template-compiler": "^2.6.14",
    "webpack": "^4.46"
  },
  "devDependencies": {
    "@nuxtjs/eslint-config": "^8.0.0",
    "@nuxtjs/google-fonts": "^1.3.0",
    "@nuxtjs/storybook": "^4.2.0",
    "@nuxtjs/style-resources": "^1.2.1",
    "@vue/cli-plugin-babel": "^4.5.15",
    "babel-eslint": "^10.1.0",
    "eslint": "^8.7.0",
    "husky": "^7.0.4",
    "nuxt-svg-loader": "^1.2.0",
    "postcss": "^8.4.5"
  }
}

According to this I should install node-sass version 6.0

But I'm trying: npm install --save-dev sass@1.49.0 node-sass@6.0.1 sass-loader@10.2.1

Also, read here to add --unsafe-perm so I tried: npm install --save-dev --unsafe-perm sass@1.49.0 node-sass@6.0.1 sass-loader@10.2.1

But it keeps failing, being the first error always this one:

npm ERR! code 1
npm ERR! path /Users/toniweb/Proyectos/our-awesome-project/node_modules/node-sass
npm ERR! command failed
npm ERR! command sh -c node scripts/build.js
npm ERR! Building: /Users/user/.nvm/versions/node/v16.13.1/bin/node /Users/toniweb/Proyectos/our-awesome-project/node_modules/node-gyp/bin/node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=

I tried removing node_modules package-lock.json and the same result

Of course, this is driving me nuts.. please tell me that anyone has an idea to try out

5

4 Answers

I think you are using ARM64 which is not supported by node-sass.

You should replace node-sass with sass(Dart Sass) as LibSass is deprecated

Just replace node-sass in your package.json file with sass. Both packages expose the same JavaScript API.

npm uninstall node-sass
npm install --save-dev sass

We have a Nuxt 2.15.8 app running on Node 16, in which a couple of months ago we switched from node-sass to sass, as the former is deprecated.

I recall at the time it took some figuring out, but in the end we just needed to install some postcss parsers to get the Nuxt app fully working with sass & sass-loader.

Taking as the baseline the package.json in your post, try:

npm install --save-dev \
  sass@1.49.4 \
  sass-loader@10.2.1 \
  postcss-html@1.3.0 \
  postcss-scss@4.0.3

The error message hints to node-gyp as the culprit. To work on a MacOS, node-gyp requires the XCode Command Line Tools to be installed (see here). So basically, in case you haven't done that yet, run

xcode-select --install

Or try any of the other methods described here. Then retry to install node-sass.

in fact , I think you have pasted the wrong error infomation. there are two ways may help you

  1. npm i --force this command will ignored the error in the package.json
  2. use the pnpm , you can install it by
npm i -g pnpm 
# then 
pnpm i

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Alexander Ross
Author

Alexander Ross

Alexander Ross has covered the video game industry for a decade, writing deep dives on game design, esports tournaments, VR developments, and gaming culture.