问题
项目npm run serve时报错:
如果你遇到了这个问题,那你一定是使用了 OpenSSL v3 的 Node.js 版本。(node版本过高)
解决
安全最重要(推荐)
👍这个问题是由 Node.js 的更新导致的,而更新的目的是为了修复高风险漏洞,对于重视安全的开发者来说,这个方案是 首 选 的 。
不少的前端项目都会使用到 webpack,如果你在使用 webpack 时遇到了这个问题,请尝试以下方案解决:
webpack v4
向 webpack 传递参数 output.hashFunction = ‘sha512’ 或 output.hashFunction = ‘sha256’,这将取决于你系统中 Node.js 支持哪些 Hash 算法。
webpack 官方文档给出的示例[2]类似于下面这样:
module.exports = {
//...
output: {
hashFunction: 'sha512',
},
};
再举个 Vue.js 的例子,编辑 vue.config.js(在项目根目录下,如不存在请创建):
module.exports = {
//...
configureWebpack: {
output: { hashFunction: 'sha512' },
},
};
webpack v5.54.0+
从 webpack v5.54.0+ 开始,hashFunction 支持 xxhash64 作为一种更快的算法,当 experiments.futureDefaults 被启用时,它将被作为默认算法使用。
如果你的 webpack 版本低于 v5.54.0,请按上方 webpack v4 的步骤操作。
如果你满足 webpack v5.54.0+ 的条件,参照上方 webpack v4 的方法,将 sha512 或 sha256 替换为 xxhash64 即可。
能跑起来就行
⚠️注意:这可能导致你使用的 OpenSSL 存在漏洞,导致安全问题,只能浅浅使用!
临时环境变量大法(通用)
这个解决办法是 通用 的!这意味着无论你是否编写的是前端项目,都可以使用这个方法,这将对 Node.js 直接生效。
运行代码前,在终端内添加环境变量 NODE_OPTIONS=–openssl-legacy-provider
macOS 和 Linux
export NODE_OPTIONS=--openssl-legacy-provider
Windows PowerShell
Windows 命令提示符(cmd)
set NODE_OPTIONS=--openssl-legacy-provider
为 Windows 设置全局环境变量
👇 这个方法对 Windows 系统来说简直就是万金油,99% 解决问题 👇
Win + R 打开 运行,输入 sysdm.cpl 后回车,选择 高级 选项,点击右下角 环境变量,点击 用户变量 中的 新建,变量名 为 NODE_OPTIONS,变量值 为 --openssl-legacy-provider。随后一直 确定 即可。
为 Vue 项目添加命令行参数
修改 packages.json 中 scripts 的一些字段:
//mac电脑
"scripts": {
"serve": "export NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",
"build": "export NODE_OPTIONS=--openssl-legacy-provider && npm install && vue-cli-service build",
},
//Windows
"scripts": {
"serve": "set NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",
"build": "set NODE_OPTIONS=--openssl-legacy-provider && npm install && vue-cli-service build",
},
为 React 项目添加命令行参数
修改 packages.json 中 scripts 的一些字段:
"scripts": {
"start": "react-scripts --openssl-legacy-provider start",
"build": "react-scripts --openssl-legacy-provider build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
终极方案:降版本
装个低版本的没受到影响的 Node.js 不就好了 😅
比如 Node.js v16.x 就是不错的选择。如果你不知道去哪里下载,你可以去 Node.js Release - v16.x 看看。对于 Windows 用户,点击链接后可以看到高亮部分,下载它并安装即可。
对于 nvm 用户来说,切换 Node.js 版本只需要一行命令即可:
如果你也想在多个 Node.js 版本之间快速切换,不妨了解一下 nvm 是否适合你。它可在 Windows 和 Linux, macOS, WSL 等系统上运行。