npm启动前端项目时报错(vue) error:0308010C:digital envelope routines::unsupported

vue 启动项目时,npm run serve 报下面的错:

error:0308010C:digital envelope routines::unsupported

at new Hash (node:internal/crypto/hash:67:19)

at Object.createHash (node:crypto:133:10)

at FSReqCallback.readFileAfterClose [as oncomplete] (node:internal/fs/read_file_context:68:3) { opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],

library: 'digital envelope routines', reason: 'unsupported', code: 'ERR_OSSL_EVP_UNSUPPORTED'

}

D:\OpenSource\bpm-platform-ui-250115>npm run dev

> work-flowable@0.8.3 dev

> vue-cli-service serve

INFO Starting development server...

95% emitting CompressionPlugin ERROR Error: error:0308010C:digital envelope routines::unsupported

Error: error:0308010C:digital envelope routines::unsupported

at new Hash (node:internal/crypto/hash:79:19)

at Object.createHash (node:crypto:139:10)

at D:\OpenSource\bpm-platform-ui-250115\node_modules\compression-webpack-plugin\dist\index.js:243:42

at CompressionPlugin.compress (D:\OpenSource\bpm-platform-ui-250115\node_modules\compression-webpack-plugin\dist\index.js:284:9)

at D:\OpenSource\bpm-platform-ui-250115\node_modules\compression-webpack-plugin\dist\index.js:305:12

at _next1 (eval at create (D:\OpenSource\bpm-platform-ui-250115\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:14:17)

at eval (eval at create (D:\OpenSource\bpm-platform-ui-250115\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:33:1)

at D:\OpenSource\bpm-platform-ui-250115\node_modules\copy-webpack-plugin\dist\index.js:91:9

解决方法:

在窗口运行如下代码(修改环境变量),回车后重启即可~~~~

复制代码
$env:NODE_OPTIONS="--openssl-legacy-provider"

前端项目使用( npm run dev ) 运行vue项目时,出现错误:Error: error:0308010C:digital envelope routines::unsupported

经过探索,发现问题所在,主要是nodeJs V17版本发布了OpenSSL3.0对算法和秘钥大小增加了更为严格的限制,导致了nodeJs V17之前版本不受影刺而nodeJs V17和之后的版本会出现这个错误。

也就是npm升级导致了与OpenSSL不兼容导致的初始化失败,也就是nodeJs版本过高的原因导致了运行失败。

系统安装的nodeJs版本正好是V18,因此出现了这个错误系统。

解决方案

1、更改系统环境变量来解决

2、更改项目环境变量来解决

3、更换NodeJs版本来解决

具体演示

1、更改系统环境变量

①Windows平台

我的电脑上右键 → 属性 → 高级系统设置 → 添加系统变量:NODE_OPTIONS = --openssl-legacy-provider

②Linux / Mac 平台

export NODE_OPTIONS=--openssl-legacy-provider

完成后,建议重新打开一个命令行窗口启动服务。

2、更改项目环境变量来解决

①在 package.json 的 scripts 中新增:SET NODE_OPTIONS=--openssl-legacy-provider

添加前代码:

"scripts": {

"dev": "vue-cli-service serve",

"build:prod": "vue-cli-service build",

"build:stage": "vue-cli-service build --mode staging",

"preview": "node build/index.js --preview",

"lint": "eslint --ext .js,.vue src",

"test:unit": "jest --clearCache && vue-cli-service test:unit",

"test:ci": "npm run lint && npm run test:unit",

"svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml"

},

添加后代码:

"scripts": {

"dev": "set NODE_OPTIONS=--openssl-legacy-provider & vue-cli-service serve",

"build:prod": "vue-cli-service build",

"build:stage": "vue-cli-service build --mode staging",

"preview": "node build/index.js --preview",

"lint": "eslint --ext .js,.vue src",

"test:unit": "jest --clearCache && vue-cli-service test:unit",

"test:ci": "npm run lint && npm run test:unit",

"svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml"

},

这里需要注意的是,要是团队中的nodejs版本不一致,不要提交该 package.json 文件。

②与①类似,在编辑器集成终端里,直接设置环境变量进行控制(这种方式只能临时解决)

具体如下:

找到 package.json 文件右键,在集成终端中打开,直接输入 set NODE_OPTIONS=--openssl-legacy-provider 回车,然后 npm run serve 重新运行项目即可。

// windows系统

set NODE_OPTIONS=--openssl-legacy-provider

// linux系统

export NODE_OPTIONS=--openssl-legacy-provider

3、更换NodeJs版本来解决

卸载本地NodeJs环境,暗转NodeJsV17之前的版本。

相关推荐
梦想CAD控件4 分钟前
在线CAD开发包结构与功能说明
前端·javascript·vue.js
张拭心8 分钟前
春节后,有些公司明确要求 AI 经验了
android·前端·人工智能
时光不负努力9 分钟前
typescript常用的dom 元素类型
前端·typescript
小怪点点14 分钟前
大文件切片上传
前端
时光不负努力15 分钟前
TS 常用工具类型
前端·javascript·typescript
SuperEugene16 分钟前
Vue状态管理扫盲篇:Vuex 到 Pinia | 为什么大家都在迁移?核心用法对比
前端·vue.js·面试
张拭心19 分钟前
Android 17 来了!新特性介绍与适配建议
android·前端
徐小夕24 分钟前
pxcharts-vue:一款专为 Vue3 打造的开源多维表格解决方案
前端·vue.js·github
Hilaku24 分钟前
我会如何考核一个在简历里大谈 AI 提效的高级前端?
前端·javascript·面试
青青家的小灰灰1 小时前
React 反模式(Anti-Patterns)排查手册:从性能杀手到逻辑陷阱
前端·javascript·react.js