npm报错：node: --openssl-legacy-provider is not allowed in NODE_OPTIONS

出现的问题

问题1:

ERROR Failed to compile with 1 error
error in ./src/modules/stu/views/member/MemberModelTest.vue?vue&type=style&index=0&id=7b0ab969&scoped=true&lang=scss
Syntax Error: Error: Node Sass version 9.0.0 is incompatible with ^4.0.0.
@ ./node_modules/vue-style-loader??ref--8-oneOf-1-0!./node_modules/css-loader??ref--8-oneOf-1-1!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src??ref--8-oneOf-1-2!./node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/modules/stu/views/member/MemberModelTest.vue?vue&type=style&index=0&id=7b0ab969&scoped=true&lang=scss 4:14-520 15:3-20:5 16:22-528
@ ./src/modules/stu/views/member/MemberModelTest.vue?vue&type=style&index=0&id=7b0ab969&scoped=true&lang=scss
@ ./src/modules/stu/views/member/MemberModelTest.vue
@ ./src/modules/stu/router/practise.js
@ ./src/modules/stu/router sync nonrecursive .js$
@ ./src/modules/stu/router/index.js
@ ./src/modules/stu/main.js
@ multi (webpack)-dev-server/client?http://xxx.xxx.xxx.13:8080/sockjs-node (webpack)/hot/dev-server.js ./src/modules/stu/main.js

问题2

node: --openssl-legacy-provider is not allowed in NODE_OPTIONS

问题3

Error: spawn vue-cli-service ENOENT

问题分析

问题1

这个问题往往出现在当你的电脑中安装了vue3的环境，而vue2的环境比如vue-cli-service等被移除，并且你运行vue2工程的时候。为什么这么说呢，你可以看报错信息中，node-sass这个sass库，通常是用于vue2的，并且这个node-sass已经被废弃，官方建议是使用dart-sass即（sass)来替代node-sass。
详细线索可以查看：https://www.npmjs.com/package/node-sass
而node-sass依赖的环境如下：

你可以查看你电脑中现有的node版本：

node -v

由于我的node版本是20以上，而且使用的是vue3开发所以，报错了问题1.

问题2

出现问题2的原因很简单，那就是我在将本地的node版本降级到node 14.18.1的时候，终端报错了，并且由于我之前开发时对react-native做优化，在bash配置中增加了--openssl-legacy-provider的环境配置，这个原因造成的。

问题3

这个问题更简单，就是我喜欢使用vue3来开发，从而删除了本地的vue2中的vue-cli-service，导致本地没有这个bash命令。

解决方案

其实第1个和第2个问题是相辅相成的，在某些特殊场景下（比如你的电脑是Mac，并且系统相匹配的openssl版本是3.x）。所以有时候，你解决了第1个问题，还需要继续解决第2个问题。

问题1

针对vue2中配置了node-sass，而本地node环境比较高（比如14以上），那么有以下几个方案：

• 使用nvm来使用本地的node，可以自由切换node（推荐）
• 降级电脑上本地的node版本
• 使用虚拟机或者docker技术来配置一个另类的

这里的3个方法都可以配置一个低版本的node环境，我个人推荐使用第一个，因为比较简单。
所以这里我解释一下第一个怎么做：

1. 安装nvm

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

2. 查看本地的nvm

nvm ls

3. 如果你需要安装某个node版本

nvm install 14.18.1 --verbose

4. 如果你想要切换某一个node版本

nvm use 14.18.1

问题2

这个问题在你的mac电脑系统内置的openssl命令在3.x，而node环境配置了--openssl-legacy-provider的情况。

1. 查看本地openssl版本

openssl -v

2. 检查本地的bash环境配置中的NODE_OPTIONS，如果有就修改一下
   有的同学是直接在终端中执行以下命令，但是如果bash文件中明确配置了这个项，其实是无效的

set NODE_OPTIONS=

所以还需要检查在Mac上的资源库目录下.bashrc和.zshrc（如果安装的是item2的终端）这2个文件

如图所示，如果有NODE_OPTIONS这个配置，那么就设为空值。

export NODE_OPTIONS=

问题3

这个问题比较简单，直接重新安装vue-cli就好。详细说明可以参考：vue-cli官网

npm install -g @vue/cli

更多信息，大家可以关注我的公众号“新卫网络科技”。