webpack react npm start报错解决 ERR_OSSL_EVP_UNSUPPORTED

最新推荐文章于 2024-12-16 00:17:50 发布
最新推荐文章于 2024-12-16 00:17:50 发布
阅读量3k 收藏 1
点赞数
CC 4.0 BY-SA版权
分类专栏： 日志 前端 文章标签： javascript react.js 前端 webpack npm
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/tianlangstudio/article/details/127910768
本文介绍了一种在使用npx create-react-app创建React项目后遇到的启动错误：Error:error:0308010C:digital envelope routines::unsupported。通过设置环境变量NODE_OPTIONS=--openssl-legacy-provider来解决此问题。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

问题描述：

使用最新的npx create-react-app my-app创建了个react项目

使用npm start启动就报错了：

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 (/data2/github/frontend/react/wasm-image-map/node_modules/webpack/lib/util/createHash.js:90:53)
    at NormalModule._initBuildHash (/data2/github/frontend/react/wasm-image-map/node_modules/webpack/lib/NormalModule.js:386:16)
    at handleParseError (/data2/github/frontend/react/wasm-image-map/node_modules/webpack/lib/NormalModule.js:434:10)
    at /data2/github/frontend/react/wasm-image-map/node_modules/webpack/lib/NormalModule.js:466:5
    at /data2/github/frontend/react/wasm-image-map/node_modules/webpack/lib/NormalModule.js:327:12
    at /data2/github/frontend/react/wasm-image-map/node_modules/loader-runner/lib/LoaderRunner.js:373:3
    at iterateNormalLoaders (/data2/github/frontend/react/wasm-image-map/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
    at iterateNormalLoaders (/data2/github/frontend/react/wasm-image-map/node_modules/loader-runner/lib/LoaderRunner.js:221:10)
    at /data2/github/frontend/react/wasm-image-map/node_modules/loader-runner/lib/LoaderRunner.js:236:3
    at runSyncOrAsync (/data2/github/frontend/react/wasm-image-map/node_modules/loader-runner/lib/LoaderRunner.js:130:11)
    at iterateNormalLoaders (/data2/github/frontend/react/wasm-image-map/node_modules/loader-runner/lib/LoaderRunner.js:232:2)
    at Array.<anonymous> (/data2/github/frontend/react/wasm-image-map/node_modules/loader-runner/lib/LoaderRunner.js:205:4)
    at Storage.finished (/data2/github/frontend/react/wasm-image-map/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:55:16)
    at /data2/github/frontend/react/wasm-image-map/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:91:9
/data2/github/frontend/react/wasm-image-map/node_modules/react-scripts/scripts/start.js:19
  throw err;
  ^

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 (/data2/github/frontend/react/wasm-image-map/node_modules/webpack/lib/util/createHash.js:90:53)
    at NormalModule._initBuildHash (/data2/github/frontend/react/wasm-image-map/node_modules/webpack/lib/NormalModule.js:386:16)
    at /data2/github/frontend/react/wasm-image-map/node_modules/webpack/lib/NormalModule.js:418:10
    at /data2/github/frontend/react/wasm-image-map/node_modules/webpack/lib/NormalModule.js:293:13
    at /data2/github/frontend/react/wasm-image-map/node_modules/loader-runner/lib/LoaderRunner.js:367:11
    at /data2/github/frontend/react/wasm-image-map/node_modules/loader-runner/lib/LoaderRunner.js:233:18
    at context.callback (/data2/github/frontend/react/wasm-image-map/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
    at /data2/github/frontend/react/wasm-image-map/node_modules/babel-loader/lib/index.js:51:103 {
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

Node.js v18.12.0
 

解决方法：

设置环境变量

在ubuntu下可以把这行添加到~/.bashrc里：

export NODE_OPTIONS=--openssl-legacy-provider

也可以每次执行npm start时设置 NODE_OPTIONS=--openssl-legacy-provider npm start

【已解决】Error: error:0308010C:digital envelope routines::unsupported
JavaPub
04-02 689
使用Ant Design， 执行出现异常。
RN iOS旧项目运行报错 ‘ERR_OSSL_EVP_UNSUPPORTED‘ Cannot read properties of undefined ‘transformFile‘
jifaliwo123的博客
09-01 1834
附上几个知道安装Watchman 4.9.0的文章：（1）
ERR_OSSL_EVP_UNSUPPORTED
2203_75892522的博客
12-16 1049
解决此问题可以在运行应用程序之前，通过设置 NODE_OPTIONS 环境变量来配置Node.js，以允许使用旧的 OpenSSL 提供程序。此错误通常由于 Node.js 的新版本与旧版本的 OpenSSL 不兼容造成。
npm 报错ERR_OSSL_EVP_UNSUPPORTED或者Error: error:0308010C:digital envelope routines::unsupported
luffysam的博客
05-07 1万+
解决error:0308010C:digital envelope routines::unsupported，ERR_OSSL_EVP_UNSUPPORTED
错误代码 ERR_OSSL_EVP_UNSUPPORTED
热门推荐
大乔技术笔记
11-08 4万+
node.js 错误代码 ERR_OSSL_EVP_UNSUPPORTED 解决方法
【前端笔记】npm报错ERR_OSSL_EVP_UNSUPPORTED
于离别之朝束起约定之花的博客
07-25 4839
原因是node v17中的OpenSSL3.0对允许算法和密钥大小增加了严格的限制。既然是版本问题，最简单粗暴的办法就是降级。然后重新启动项目，就不会失败了。
opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error', 'error:0308010C:digital envelope routines::unsupported' ], library: 'digital envelope routines', reason: 'unsupported', code: 'ERR_OSSL_EVP_UNSUPPORTE
03-21
当遇到 `ERR_OSSL_EVP_UNSUPPORTED` 错误以及与 `digital envelope routines` 相关的初始化失败时，通常是因为 Node.js 版本升级后默认启用了更安全的加密算法，而某些旧版本依赖项可能无法兼容这些新特性。...
node:internal/crypto/hash:79 this[kHandle] = new _Hash(algorithm, xofLen, algorithmId, getHashCache()); ^ Error: error:0308010C:digital envelope routines::unsupported at new Hash (node:internal/crypto/hash:79:19) at Object.createHash (node:crypto:139:10) at BulkUpdateDecorator.hashFactory (E:\XQproject\myap\node_modules\@umijs\deps\compiled\webpack\5\bundle5.js:184161:18) at BulkUpdateDecorator.update (E:\XQproject\myap\node_modules\@umijs\deps\compiled\webpack\5\bundle5.js:184062:50) at E:\XQproject\myap\node_modules\@umijs\deps\compiled\webpack\5\bundle5.js:107101:9 at E:\XQproject\myap\node_modules\@umijs\deps\compiled\webpack\5\bundle5.js:33829:16 at FSReqCallback.readFileAfterClose [as oncomplete] (node:internal/fs/read/context:68:3) { opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error', 'error:0308010C:digital envelope routines::unsupported' ], library: 'digital envelope routines', reason: 'unsupported', code: 'ERR_OSSL_EVP_UNSUPPORTED' } Node.js v22.17.0 Done in 6.85s.
06-30
我们正在处理一个Node.js错误：ERR_OSSL_EVP_UNSUPPORTED，它发生在使用OpenSSL的digitalenvelope routines时，提示“unsupported”。根据引用内容，这通常是因为Node.js版本（17+）使用了OpenSSL3.0，而一些旧的...
node:internal/crypto/hash:71 this[kHandle] = new _Hash(algorithm, xofLen); ^ 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 (E:\jetlinks\jetlinks\jetlinks\ironman-web\node_modules\.pnpm\webpack@4.41.1\node_modules\webpack\lib\util\createHash.js:135:53) at NormalModule._initBuildHash (E:\jetlinks\jetlinks\jetlinks\ironman-web\node_modules\.pnpm\webpack@4.41.1\node_modules\webpack\lib\NormalModule.js:417:16) at handleParseError (E:\jetlinks\jetlinks\jetlinks\ironman-web\node_modules\.pnpm\webpack@4.41.1\node_modules\webpack\lib\NormalModule.js:471:10) at E:\jetlinks\jetlinks\jetlinks\ironman-web\node_modules\.pnpm\webpack@4.41.1\node_modules\webpack\lib\NormalModule.js:503:5 at E:\jetlinks\jetlinks\jetlinks\ironman-web\node_modules\.pnpm\webpack@4.41.1\node_modules\webpack\lib\NormalModule.js:358:12 at E:\jetlinks\jetlinks\jetlinks\ironman-web\node_modules\.pnpm\loader-runner@2.4.0\node_modules\loader-runner\lib\LoaderRunner.js:373:3 at iterateNormalLoaders (E:\jetlinks\jetlinks\jetlinks\ironman-web\node_modules\.pnpm\loader-runner@2.4.0\node_modules\loader-runner\lib\LoaderRunner.js:214:10) at Array.<anonymous> (E:\jetlinks\jetlinks\jetlinks\ironman-web\node_modules\.pnpm\loader-runner@2.4.0\node_modules\loader-runner\lib\LoaderRunner.js:205:4) at Storage.finished (E:\jetlinks\jetlinks\jetlinks\ironman-web\node_modules\.pnpm\enhanced-resolve@4.5.0\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:55:16) at E:\jetlinks\jetlinks\jetlinks\ironman-web\node_modules\.pnpm\enhanced-resolve@4.5.0\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:91:9 at E:\jetlinks\jetlinks\jetlinks\ironman-web\node_modules\.pnpm\graceful-fs@4.2.11\node_modules\graceful-fs\graceful-fs.js:123:16 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' } Node.js v18.14.0
最新发布
08-03
我们正在处理的是在Node.js v18.14.0环境下，使用Webpack 4.41.1时出现的错误：`Error: error:0308010C:digital envelope routines::unsupported`。 根据引用[2]和引用[3]中的信息，这个错误是由于Node.js v17及...
Error: error:0308010C:digital envelope routines::unsupported [0] at new Hash (node:internal/crypto/hash:69:19) [0] at Object.createHash (node:crypto:133:10) [0] at module.exports (C:\Users\烟火阑珊倚人间\react3\node_modules\webpack\lib\util\createHash.js:135:53) [0] at NormalModule._initBuildHash (C:\Users\烟火阑珊倚人间\react3\node_modules\webpack\lib\NormalModule.js:417:16) [0] at handleParseError (C:\Users\烟火阑珊倚人间\react3\node_modules\webpack\lib\NormalModule.js:471:10) [0] at C:\Users\烟火阑珊倚人间\react3\node_modules\webpack\lib\NormalModule.js:503:5 [0] at C:\Users\烟火阑珊倚人间\react3\node_modules\webpack\lib\NormalModule.js:358:12 [0] at C:\Users\烟火阑珊倚人间\react3\node_modules\webpack\node_modules\loader-runner\lib\LoaderRunner.js:373:3 [0] at iterateNormalLoaders (C:\Users\烟火阑珊倚人间\react3\node_modules\webpack\node_modules\loader-runner\lib\LoaderRunner.js:214:10) [0] at Array.<anonymous> (C:\Users\烟火阑珊倚人间\react3\node_modules\webpack\node_modules\loader-runner\lib\LoaderRunner.js:205:4) { [0] opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ], [0] library: 'digital envelope routines', [0] reason: 'unsupported', [0] code: 'ERR_OSSL_EVP_UNSUPPORTED'
07-25
根据你提供的错误信息，看起来是在构建 webpack 时出现了问题...如果尝试了上述解决方案后仍然无法解决问题，请提供更多详细的错误信息和你的操作系统、Node.js 和 webpack 版本等相关信息，以便更好地帮助你解决问题。
【Vue】ERR_OSSL_EVP_UNSUPPORTED 报错问题解决
yqyn6的博客
05-25 1万+
【vue】opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ] 报错解决
Vue报错[ERR_OSSL_EVP_UNSUPPORTED] node版本过高导致项目无法启动
爱吃猫的鱼
08-10 1063
vue项目启动报错ERR_OSSL_EVP_UNSUPPORTED 导致无法启动
node版本过高出现ERR_OSSL_EVP_UNSUPPORTED错误
w710537643的博客
06-21 3645
新版本的nodejs使用的openssl和旧版本不同，导致出错。1.将node版本重新换回16.x。2 windows 下。
vue项目启动报错，错误代码 ERR_OSSL_EVP_UNSUPPORTED
qq_42859450的博客
03-03 2535
vue项目启动报错
Mac的nodejs npm run build 报ERR_OSSL_EVP_UNSUPPORTED彻底解决办法
陈万洲的专栏
03-11 1359
网上大部分教程是 sudo vim ~/.bash_profile 但是发现重启Mac后又不行了。所以推荐修改zsh的环境变量即可。
Node.js error: ERR_OSSL_EVP_UNSUPPORTED
m0_75186659的博客
12-04 1万+
使用时遇到错误代码为ERR_OSSL_EVP_UNSUPPORTED的报错，需要修改package.json添加参数--openssl-legacy-provider该应用生效，或者配置环境变量所有应用生效。
vue项目报错ERR_OSSL_EVP_UNSUPPORTED
07-23 544
然后再重新运行即可解决。
vue报错 ERR_OSSL_EVP_UNSUPPORTED
weixin_45357661的博客
02-13 6621
ERR_OSSL_EVP_UNSUPPORTED
vue项目运行报错 ERR_MODULE_NOT_FOUND
07-24
<think>我们正在解决Vue项目运行时报错`ERR_MODULE_NOT_FOUND`的问题。根据引用内容，该错误通常表示Node.js在尝试导入模块时找不到指定的包。常见原因包括： 1. 依赖包未安装 2. 项目路径或名称更改导致模块解析失败 3. node环境变量配置问题 4. 特定包（如sass-loader）的版本兼容性问题 下面将逐步分析并提供解决方案： ### 步骤1：检查依赖安装 首先确保所有依赖包已正确安装。在项目根目录执行： ```bash npm install ``` 或使用淘宝镜像加速： ```bash cnpm install ``` ### 步骤2：检查项目路径和名称 若最近更改过项目目录名称，需确保： - `package.json`中的`name`字段与目录名一致（引用[2]） - 删除`node_modules`和`package-lock.json`（或`yarn.lock`）后重新安装依赖： ```bash rm -rf node_modules package-lock.json npm install ``` ### 步骤3：验证Node环境配置 若出现`/usr/bin/env: node: No such file or directory`（引用[3]），可能是Node环境变量问题。解决方案： - 创建软链接（Linux/macOS）： ```bash sudo ln -s /usr/bin/nodejs /usr/bin/node ``` - Windows需确保Node.js安装路径已加入系统环境变量`PATH` ### 步骤4：处理特定包缺失 #### 案例1：缺少`express` 若报错`Cannot find package 'express'`（引用[1]）： ```bash npm install express --save ``` #### 案例2：缺少`sass-loader` 若报错`Module not found: Error: Can't resolve 'sass-loader'`（引用[4]）： ```bash npm install sass-loader@7.3.1 node-sass --save-dev ``` > **注意**：高版本`sass-loader`可能与Webpack配置冲突，建议安装兼容版本（如`7.3.1`） ### 步骤5：清除缓存 执行以下命令清除npm缓存并重新构建： ```bash npm cache clean --force rm -rf node_modules npm install ``` ### 步骤6：检查模块导入方式 确保代码中导入模块的路径正确。例如： ```javascript // 正确示例 import express from 'express'; // 错误示例（路径错误） import express from './express'; ``` ### 总结流程图 ```mermaid graph TD A[报错 ERR_MODULE_NOT_FOUND] --> B{检查依赖是否安装} B -->|未安装| C[执行 npm install] B -->|已安装| D{是否更改项目路径/名称} D -->|是| E[同步 package.json 并重装依赖] D -->|否| F{检查环境变量} F -->|异常| G[配置Node环境变量] F -->|正常| H{是否特定包缺失} H -->|是| I[安装对应包] H -->|否| J[清除缓存并重装依赖] I --> J E --> J C --> K[问题解决] J --> K ``` ### 附加建议 - 使用`npm list <package>`检查特定包是否安装 - 升级Node.js至最新稳定版 - 检查`package.json`中依赖版本是否冲突 通过以上步骤，绝大多数`ERR_MODULE_NOT_FOUND`错误可被解决。若问题仍存在，请提供具体报错信息以便进一步排查。 §§相关问题§§ 1. 如何修复Vue项目中`sass-loader`版本兼容性问题？ 2. Node.js环境变量配置错误会导致哪些常见问题？ 3. Vue项目迁移后如何避免模块解析失败？</think>### 解决 Vue 项目运行时报错 ERR_MODULE_NOT_FOUND 该错误通常发生在以下场景： 1. 依赖包未安装或安装不完整 2. 项目路径/名称变更导致模块解析失败 3. Node.js 环境配置异常 4. 特定依赖包版本不兼容 #### 🔧 解决方案分步指南： 1. **重新安装依赖** ```bash # 删除现有依赖 rm -rf node_modules package-lock.json # 重新安装（推荐淘宝镜像） npm install -g cnpm --registry=https://registry.npmmirror.com cnpm install ``` > 适用于未正确安装依赖的情况[^1][^2] 2. **检查项目路径与名称** - 确保 `package.json` 中的 `name` 字段与当前目录名一致 - 避免路径包含中文或特殊字符 ```json { "name": "your-project-name", // 需与实际目录名相同 "dependencies": { ... } } ``` 3. **验证 Node.js 环境** ```bash node -v # 检查Node版本（推荐v16+） which node # 检查执行路径 ``` Linux系统若出现 `node: 没有那个文件或目录`，需创建软链接： ```bash sudo ln -s /usr/bin/nodejs /usr/bin/node # [^3] ``` 4. **修复特定包缺失问题** - **示例1：缺少 express** ```bash cnpm install express --save ``` - **示例2：缺少 sass-loader** ```bash cnpm install sass-loader@7.3.1 node-sass -D # 需指定兼容版本[^4] ``` 5. **清除缓存重建** ```bash npm cache clean --force npm rebuild ``` 6. **检查模块导入方式** 确保代码中导入路径正确（区分绝对/相对路径）： ```javascript // 正确示例 import express from 'express'; // 错误示例（缺少相对路径标识） import utils from 'src/utils'; ``` #### ⚠️ 常见错误场景对照表 | 错误信息 | 解决方案 | |---------|---------| | `Cannot find package 'express'` | 执行 `npm install express` | | `Cannot resolve 'sass-loader'` | 安装指定版本 `sass-loader@7.3.1` | | 目录更名后报错 | 同步修改 `package.json` 的 name 字段 | | `/usr/bin/env: node: No such file` | 创建 nodejs 到 node 的软链接 | > **重要提示**：若使用 Vue 3 + Vite，需注意原生 ES 模块(ESM)的导入规范，CommonJS 模块需通过 `require()` 引入。 通过以上步骤，95% 的 `ERR_MODULE_NOT_FOUND` 错误可被解决。若问题仍存在，请提供完整的报错日志进一步分析。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

CoderFusionZhu

不要打赏太多哦！我喝速溶就行

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值