npm安装node-sass失败的几种解决办法

        这两天在跑一个5年前的老项目https://github.com/yunser/photo-front, 项目截图如下:

npm安装node-sass失败的几种解决办法_第1张图片

         可以看出里面没有node_modules文件夹,需要我们自己手动输入npm install 命令安装(node_modules是在npm i执行完成后出现的),需要安装的依赖包在package.jison文件夹里面。

npm安装node-sass失败的几种解决办法_第2张图片

        这时,劝退无数人的噩梦这时候降临了。在用npm install 命令安装的时候总是不成功, 报错结果如下:

npm安装node-sass失败的几种解决办法_第3张图片

 这种情况一般都是node-sass 版本不适配造成的。本人在网上搜了好多相关教程,但是大多数根本不行,解决不了这个问题,经过本人2天时间的探索,总结出了四种不同的解决方法。


方法一: 降低自己的node.js版本。

        直接卸载自己的最新版的node.js,安装一个旧的版本,个人推荐node.js-v14的版本。再重新配置了node.js的环境变量后,输入npm install,安装成功,输入npm run dev,运行成功。

方法二:直接复制一个可行的 node_modules文件夹,在微调一下包的问题。

        本人在台式机里用低版本的node.js-v16环境成功运行了这个项目后,在笔记本电脑里用node.js-v18环境运行失败了,同样,爆出了如上图所示的错误。但也因此想出了另一个解决方法:直接复制一个已经下载好的node_modules文件夹,输入npm run dev。

        注意:这里幸运的小伙伴说不定直接就成了。但是不幸运的小伙伴,十有八九会报错误,但是这个错误十分的好解决,卸载掉冲突包,重装就行了,完美运行。

方法三:查一下node.js和mode-sass版本的适配情况,直接在package.json里修改下node-sass 的版本号, 再执行下npm  i。

        本人在笔记本电脑里用node.js-v18环境,修改package.json里的node-sass 的版本号为 

"node-sass": "^8.0.0",

执行npm  i,不出意外,又报错了:

npm安装node-sass失败的几种解决办法_第4张图片

         看情况,好像是package中node-sass和sass-loader不匹配,解决方法输入:npm install --legacy-peer-deps 来解决下载时候产生的依赖冲突,成功运行。

npm安装node-sass失败的几种解决办法_第5张图片

方法四: 安装nvm,切换低版本的node.js

        NVM (Node Version Manager): Nodejs的版本管理工具;可以使用nvm,让我们在同一台设备上进行多个node版本之间切换。

        但是小伙伴们要注意一个前提,要先把node.js卸载干净再安装nvm。卸载node.js的教程我不在多说,大家自己上网搜,我这里重点提一下该删干净哪些东西:

1、删除C:\Users\用户名\AppData\Roaming目录下的npmnpm-cache;

2、删除C:\Users\123\AppData\Local\目录下的npm-cache;

3、看看node安装目录中还有没有node文件夹,有的话一起删除;

4、看看C:\Users\用户名 文件夹下有没有.npmrc以及.yarnrc等等统统删;

5、看看你的环境变量有没有node相关的,有的话也一起删除了。

        至于nvm的安装教程,看这篇window下安装并使用nvm(含卸载node、卸载nvm、全局安装npm足矣。


 nvm安装使用低版本node.js(非命令安装)

        但这个nvm仍然是有缺陷的:我们使用nvm切换版本时,使用命令nvm list available查看可以下载的node版本都比较高,但是我们想要使用低版本的要怎么做?或者运气背,碰到nvm镜像源更新,我们暂时没办法用 命令 nvm install 14.14.0 安装 包怎么办?

        直接去官网 https://nodejs.org/en/download/releases/ ,下载我们想要安装的版本,然后解压到nvm目录下,注意,我们要修改文件加名称为 v版本号,并且打开文件夹就是node的文件目录,不要嵌套,步骤如下:

 

 

点开上面的我给你的链接:

npm安装node-sass失败的几种解决办法_第6张图片

 

 我选的是 node-v16.20.0-win-x64.zip,下载,解压

npm安装node-sass失败的几种解决办法_第7张图片

 

 解压到nvm目录下:

 

将文件重命名为 v18.16.0:

npm安装node-sass失败的几种解决办法_第8张图片

 

 v18.16.0 文件夹里面的内容如图所示:

npm安装node-sass失败的几种解决办法_第9张图片

 

打开cmd,输入nvm list就可以看到我们刚刚解压的版本了,然后输入nvm use v18.16.0,即可切换成功。至此解决完成。

 npm安装node-sass失败的几种解决办法_第10张图片


乱码的问题 

 但但但但是,可能会有一部分倒霉蛋会遇到:使用 nvm use <版本号> 把node切换到指定版本会出现乱码的问题:

npm安装node-sass失败的几种解决办法_第11张图片

注意:如果这里有报错,nvm use 版本号 出现了乱码那是权限问题,我们需要进入目录C:\Windows\System32 找到 cmd.exe 右键选择管理员身份运行,之后执行nvm use 版本号 没有报错就解决了

npm安装node-sass失败的几种解决办法_第12张图片

五年前的项目运行后结果图: 

npm安装node-sass失败的几种解决办法_第13张图片


参考链接:

安装 node-sass 的正确姿势 

Node.js下载安装及环境配置教程【超详细】 

npm install xxxx --legacy-peer-deps命令是什么? 

window下安装并使用nvm(含卸载node、卸载nvm、全局安装npm)

你可能感兴趣的:(前端,npm,sass,vue.js)