Can't install node-sass#6 for node v16 - node.js

Question

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

Answer 1

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

Answer 2

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

Answer 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.

Answer 4

in fact , I think you have pasted the wrong error infomation.
there are two ways may help you
npm i --force this command will ignored the error in the package.json
use the pnpm , you can install it by
npm i -g pnpm
# then
pnpm i