[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"$ffvoG9YCzeNDto1We0UDajvRNNj6P6gLtkIwgQprZskw":3},{"code":4,"message":5,"data":6},200,"成功",{"id":7,"createdAt":8,"title":9,"content":10,"summary":11,"image":12,"uid":13,"user":14,"categoryId":21,"category":22,"subCategoryId":24,"subCategory":25,"comments":27,"status":17,"reason":28,"notice":28,"visitCount":29,"commentCount":30,"keywords":31},111,"2024-05-17T01:32:02.657Z","npm报错：node: --openssl-legacy-provider is not allowed in NODE_OPTIONS","## 出现的问题\n问题1:\n> ERROR  Failed to compile with 1 error                                        \n error  in ./src/modules/stu/views/member/MemberModelTest.vue?vue&type=style&index=0&id=7b0ab969&scoped=true&lang=scss\nSyntax Error: Error: Node Sass version 9.0.0 is incompatible with ^4.0.0.\n @ ./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\n @ ./src/modules/stu/views/member/MemberModelTest.vue?vue&type=style&index=0&id=7b0ab969&scoped=true&lang=scss\n @ ./src/modules/stu/views/member/MemberModelTest.vue\n @ ./src/modules/stu/router/practise.js\n @ ./src/modules/stu/router sync nonrecursive .js$\n @ ./src/modules/stu/router/index.js\n @ ./src/modules/stu/main.js\n @ multi (webpack)-dev-server/client?http://xxx.xxx.xxx.13:8080/sockjs-node (webpack)/hot/dev-server.js ./src/modules/stu/main.js\n\n问题2\n> node: --openssl-legacy-provider is not allowed in NODE_OPTIONS\n\n问题3\n> Error: spawn vue-cli-service ENOENT\n\n## 问题分析\n### 问题1\n这个问题往往出现在当你的电脑中安装了vue3的环境，而vue2的环境比如vue-cli-service等被移除，并且你运行vue2工程的时候。为什么这么说呢，你可以看报错信息中，node-sass这个sass库，通常是用于vue2的，并且这个node-sass已经被废弃，官方建议是使用dart-sass即（sass)来替代node-sass。\n详细线索可以查看：[https://www.npmjs.com/package/node-sass](https://www.npmjs.com/package/node-sass)\n而node-sass依赖的环境如下：\n![node-sass.png](https://image.xinwei.ltd/image1715906803789.png)\n\n你可以查看你电脑中现有的node版本：\n```terminal\nnode -v\n```\n由于我的node版本是20以上，而且使用的是vue3开发所以，报错了问题1.\n\n### 问题2\n出现问题2的原因很简单，那就是我在将本地的node版本降级到node 14.18.1的时候，终端报错了，并且由于我之前开发时对react-native做优化，在bash配置中增加了`--openssl-legacy-provider`的环境配置，这个原因造成的。\n\n### 问题3\n这个问题更简单，就是我喜欢使用vue3来开发，从而删除了本地的vue2中的`vue-cli-service`，导致本地没有这个bash命令。\n\n## 解决方案\n其实第1个和第2个问题是相辅相成的，在某些特殊场景下（比如你的电脑是Mac，并且系统相匹配的openssl版本是3.x）。所以有时候，你解决了第1个问题，还需要继续解决第2个问题。\n### 问题1\n针对vue2中配置了node-sass，而本地node环境比较高（比如14以上），那么有以下几个方案：\n- 使用nvm来使用本地的node，可以自由切换node（推荐）\n- 降级电脑上本地的node版本\n- 使用虚拟机或者docker技术来配置一个另类的\n\n这里的3个方法都可以配置一个低版本的node环境，我个人推荐使用第一个，因为比较简单。\n所以这里我解释一下第一个怎么做：\n1. 安装nvm\n```terminal\ncurl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash\n```\n\n2. 查看本地的nvm\n```terminal\nnvm ls\n```\n![nvm ls命令.png](https://image.xinwei.ltd/image1715908341860.png)\n\n3. 如果你需要安装某个node版本\n```terminal\nnvm install 14.18.1 --verbose\n```\n\n4. 如果你想要切换某一个node版本\n```terminal\nnvm use 14.18.1\n```\n\n### 问题2\n这个问题在你的mac电脑系统内置的openssl命令在3.x，而node环境配置了`--openssl-legacy-provider`的情况。\n1. 查看本地openssl版本\n```terminal\nopenssl -v\n```\n![](https://image.xinwei.ltd/image1715908806020.png)\n\n2. 检查本地的bash环境配置中的`NODE_OPTIONS`，如果有就修改一下\n有的同学是直接在终端中执行以下命令，但是如果bash文件中明确配置了这个项，其实是无效的\n```terminal\nset NODE_OPTIONS=\n```\n所以还需要检查在Mac上的资源库目录下.bashrc和.zshrc（如果安装的是item2的终端）这2个文件\n![node_options的配置.png](https://image.xinwei.ltd/21715909356941.png)\n如图所示，如果有`NODE_OPTIONS`这个配置，那么就设为空值。\n```.zshrc\nexport NODE_OPTIONS=\n```\n\n### 问题3\n这个问题比较简单，直接重新安装vue-cli就好。详细说明可以参考：[vue-cli官网](https://cli.vuejs.org/zh/#%E8%B5%B7%E6%AD%A5)\n```terminal\nnpm install -g @vue/cli\n```\n\n更多信息，大家可以关注我的公众号“新卫网络科技”。\n\n\n\n\n\n\n\n\n\n","很多时候，我们在开发前端项目中，会遇到node版本和项目中依赖不匹配的问题，正如标题上所写的那样，在执行node -v相关的node命令时，可能出现如此报错，这篇文章就来探讨一下如何解决这个问题。","https://image.xinwei.ltd/image1715906803789.png",499668042977349,{"phone":15,"userId":13,"nickName":16,"vipType":17,"avatar":18,"sign":19,"createdAt":20},"13121171998","全栈老韩",1,"https://image.xinwei.ltd/images/IMG_5430.JPG","全栈工程师，擅长iOS App开发、前端（vue、react、nuxt、小程序&Taro）开发、Flutter、React Native、后端（midwayjs、golang、express、koa）开发、docker容器、seo优化等。","2024-01-01T16:14:30.305Z",2,{"id":21,"name":23},"IT技术",17,{"id":24,"name":26,"parentId":21},"Node",[],"",2349,0,"node,npm,node版本,node issue,npm问题,npm nvm"]