npm run serve運(yùn)行vue項(xiàng)目時(shí)報(bào)錯(cuò):Error: error:0308010C:digital envelope routines::unsupported的解決方法
問題描述
用npm run serve運(yùn)行vue項(xiàng)目時(shí),出現(xiàn)報(bào)錯(cuò):Error: error:0308010C:digital envelope routines::unsupported
報(bào)錯(cuò)信息
前端項(xiàng)目啟動(dòng)(npm run dev)和打包時(shí)(npm run build:prod)報(bào)出如下錯(cuò)誤,
Error: error:0308010C:digital envelope routines::unsupported at new Hash (node:internal/crypto/hash:71:19) at Object.createHash (node:crypto:133:10) at module.exports .... 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' }
問題原因:
經(jīng)過一番探索,終于找到了癥結(jié)所在:主要是nodeJs V17版本發(fā)布了OpenSSL3.0對算法和秘鑰大小增加了更為嚴(yán)格的限制,nodeJs v17之前版本沒影響,但V17和之后版本會(huì)出現(xiàn)這個(gè)錯(cuò)誤。
一句話總結(jié),說白了就是npm升級(jí)導(dǎo)致與 openssl 不兼容導(dǎo)致的初始化失敗,也就是node.js版本過高的原因造成的運(yùn)行失敗。
解決辦法(僅windows):
方式一:通過更改環(huán)境變量,進(jìn)行控制
1、在package.json的scripts中新增SET NODE_OPTIONS=--openssl-legacy-provider
添加前:
"scripts": { "serve": "vue-cli-service serve", "build": "vue-cli-service build", "lint": "vue-cli-service lint" },
添加后
"scripts": { "serve": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve", "build": "vue-cli-service build", "lint": "vue-cli-service lint" },
注意:如果團(tuán)隊(duì)中node版本不一致,不要將該package.json提交。
2、與第一種方法類似,在編輯器集成終端里,直接設(shè)置環(huán)境變量,進(jìn)行控制(只能臨時(shí)解決)
找到package.json文件右鍵,在集成終端中打開后,直接輸入set NODE_OPTIONS=--openssl-legacy-provider 或 $env:NODE_OPTIONS="--openssl-legacy-provider"回車,然后npm run serve重新運(yùn)行項(xiàng)目即可。
// windows下 set NODE_OPTIONS=--openssl-legacy-provider // linux下 export NODE_OPTIONS=--openssl-legacy-provider
方式二:更換node.js版本
以上就是npm run serve運(yùn)行vue項(xiàng)目時(shí),出現(xiàn)報(bào)錯(cuò):Error: error:0308010C:digital envelope routines::unsupported的解決方法的詳細(xì)內(nèi)容,更多關(guān)于npm run serve運(yùn)行vue項(xiàng)目報(bào)錯(cuò)的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
vue新建環(huán)境變量以及網(wǎng)絡(luò)請求工具axios的二次封裝詳解
這篇文章主要為大家介紹了vue新建環(huán)境變量以及網(wǎng)絡(luò)請求工具axios的二次封裝詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-06-06頁面內(nèi)錨點(diǎn)定位及跳轉(zhuǎn)方法總結(jié)(推薦)
這篇文章主要介紹了頁面內(nèi)錨點(diǎn)定位及跳轉(zhuǎn)方法總結(jié),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04element-ui中如何給el-table的某一行或某一列加樣式
本文主要介紹了element-ui中怎么給el-table的某一行或某一列加樣式,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-01-01vue中如何實(shí)現(xiàn)pdf文件預(yù)覽的方法
這篇文章主要介紹了vue中如何實(shí)現(xiàn)pdf文件預(yù)覽的方法,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-07-07