记录一些报错记录
前言
记录 啥都记的那种 ~
2023.12.31
ERROR in ./src/icons/index.js 2:0-43
Module not found: Error: Can't resolve '@/components/SvgIcon' in 'C:\Users\86151\Desktop\Git本地仓库\mini-wyy\src\icons'
@ ./src/main.js 7:0-23
webpack compiled with 1 error在我的 ./src/icons/index.js 文件中，我试图从 ‘@/components/SvgIcon’ 导入一些内容，但是Webpack没能在我给出的路径找到该模块。
果然，是我拼写错了，看来不是 webpack 的配置问题。
2023.12.31
main.js:14 [Vue warn]: Unknown custom element: <CommonHeader> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
found in
---> <MainPanel> at src/views/MainPanel.vue
<App> at src/App.vue
<Root>报错信息 Unknown custom element: <CommonHeader> 表示我在 MainPanel 组件中使用了一个名为 CommonHeader 的组件，但是并没有在 MainPanel 组件中进行注册。
基于组件化的 Vue.js，每个 Vue 组件需要在使用之前注册。Vue 提供了全局注册和局部注册两种方式：
全局注册
在入口文件（例如 main.js 或 main.ts）中，可以通过Vue.component(tagName, options) 来进行全局注册，之后就可以在项目的任何位置使用这个组件。例如全局注册 CommonHeader 组件：
import Vue from 'vue'
import CommonHeader from './components/CommonHeader.vue'
Vue.component('CommonHeader', CommonHeader)局部注册
在每个 Vue 组件的 components 对象中注册其他组件，然后在该组件中使用。例如在 MainPanel 组件中注册 CommonHeader 组件：
import CommonHeader from './components/CommonHeader.vue'
export default {
components: {
CommonHeader
}
}我的 CommonHeader 不是异步组件，原来是我忘记了了给它注册了，悲痛了，又解决了一个无聊的 bug，嘻嘻。
2023.1.6
C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev>npm run serve
> onediv@0.1.0 serve
> vue-cli-service serve
INFO Starting development server...
10% building 2/2 modules 0 active(node:16592) [DEP0111] DeprecationWarning: Access to process.binding('http_parser') is deprecated.
(Use `node --trace-deprecation ...` to show where the warning was created)
10% building 2/4 modules 2 active ...ui-dev\node_modules\webpack\hot\dev-server.jsError: error:0308010C:digital envelope routines::unsupported
at new Hash (node:internal/crypto/hash:69:19)
at Object.createHash (node:crypto:138:10)
at module.exports (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\webpack\lib\util\createHash.js:135:53)
at NormalModule._initBuildHash (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\webpack\lib\NormalModule.js:417:16)
at handleParseError (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\webpack\lib\NormalModule.js:471:10)
at C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\webpack\lib\NormalModule.js:503:5
at C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\webpack\lib\NormalModule.js:358:12
at C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\loader-runner\lib\LoaderRunner.js:373:3
at iterateNormalLoaders (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\loader-runner\lib\LoaderRunner.js:214:10)
at iterateNormalLoaders (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\loader-runner\lib\LoaderRunner.js:221:10)
at C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\loader-runner\lib\LoaderRunner.js:236:3
at runSyncOrAsync (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\loader-runner\lib\LoaderRunner.js:130:11)
at iterateNormalLoaders (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\loader-runner\lib\LoaderRunner.js:232:2)
at Array.<anonymous> (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\loader-runner\lib\LoaderRunner.js:205:4)
at Storage.finished (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:55:16)
at C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:91:9
10% building 2/5 modules 3 active ...组件库\vue-div-ui-dev\vue-div-ui-dev\src\main.jsnode:internal/crypto/hash:69
this[kHandle] = new _Hash(algorithm, xofLen);
^
Error: error:0308010C:digital envelope routines::unsupported
at new Hash (node:internal/crypto/hash:69:19)
at Object.createHash (node:crypto:138:10)
at module.exports (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\webpack\lib\util\createHash.js:135:53)
at NormalModule._initBuildHash (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\webpack\lib\NormalModule.js:417:16)
at handleParseError (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\webpack\lib\NormalModule.js:471:10)
at C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\webpack\lib\NormalModule.js:503:5
at C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\webpack\lib\NormalModule.js:358:12
at C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\loader-runner\lib\LoaderRunner.js:373:3
at iterateNormalLoaders (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\loader-runner\lib\LoaderRunner.js:214:10)
at Array.<anonymous> (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\loader-runner\lib\LoaderRunner.js:205:4)
at Storage.finished (C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:55:16)
at C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:91:9
at C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev\node_modules\graceful-fs\graceful-fs.js:123:16
at FSReqCallback.readFileAfterClose [as oncomplete] (node:internal/fs/read/context:68:3) {
opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
library: 'digital envelope routines',
reason: 'unsupported',
code: 'ERR_OSSL_EVP_UNSUPPORTED'
}
Node.js v20.5.0哎哟喂，在运行Vue项目时出现了一些麻烦，报错信息怪怪的：“Error: error:0308010C:digital envelope routines::unsupported”，这是什么鬼？咋看都像是跳梁小丑在捣乱。不过别怕，瞧！这个报错信息，可能是因为我i把 Node.js 更新到了最新版，对吧？给自己点个赞，保持软件版本更新真是个好习惯！
但是，话又说回来，这个错误消息看起来像是来自 Node.js 的底层加密库：OpenSSL。原来是这个家伙搞的鬼啊。新版本的 Node.js 使用了最新版本的 OpenSSL，然后这个OpenSSL可能不支持我项目中使用到的某种加密算法。哎哟嘿，可真是让人头痛。
不过别急，首先，我先试试将 Node.js 降级到稍早一点的版本，嘿嘿，nvm 派上用场了
nvm install 14.17.0nvm use 14.17.0又继续报错了
PS C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev> npm run serve
ERROR: npm v10.2.5 is known not to run on Node.js v14.17.0. This version of npm supports the following node versions: `^18.17.0 || >=20.5.0`. You can find the latest version at https://nodejs.org/.
ERROR:
C:\Program Files\nodejs\node_global\node_modules\npm\node_modules\@npmcli\agent\lib\agents.js:105
options.lookup ??= this.#options.lookup
^^^
SyntaxError: Unexpected token '??='
at wrapSafe (internal/modules/cjs/loader.js:984:16)
at Module._compile (internal/modules/cjs/loader.js:1032:27)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1097:10)
at Module.load (internal/modules/cjs/loader.js:933:32)
at Function.Module._load (internal/modules/cjs/loader.js:774:14)
at Module.require (internal/modules/cjs/loader.js:957:19)
at require (internal/modules/cjs/helpers.js:88:18)
at Object.<anonymous> (C:\Program Files\nodejs\node_global\node_modules\npm\node_modules\@npmcli\agent\lib\index.js:7:15)
at Module._compile (internal/modules/cjs/loader.js:1068:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1097:10)
PS C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev>似乎俺的操作还是让 Node.js 和 npm 之间出现了一些不和谐的情况。
这个报错主要告诉我，“你用的 npm 版本（v10.2.5）和 Node.js 版本（v14.17.0）不太配，他们俩在一起不能很好地工作。这个 npm 版本支持的 Node.js 版本要么是18.17.0以上，要么是20.5.0及以上版本。” 所以俺得升级一下npm，让 Node.js 和 npm 之间和谐相处。
升级 npm 的方法也很简单：
npm install -g npm@latest这个命令会全局安装最新的 npm 版本。安装完成后，你可以运行 npm -v 来检查下新的 npm 版本。
困难再大，轮不到咱放弃，不就是个小bug嘛，让bug去头皮发麻！加油！
又继续报错了，太好了
C:\Users\86151\Desktop\VUE组件库\vue-div-ui-dev\vue-div-ui-dev>npm install -g npm@latest
ERROR: npm v10.2.5 is known not to run on Node.js v14.17.0. This version of npm supports the following node versions: `^18.17.0 || >=20.5.0`. You can find the latest version at https://nodejs.org/.
ERROR:
C:\Program Files\nodejs\node_global\node_modules\npm\node_modules\@npmcli\agent\lib\agents.js:105
options.lookup ??= this.#options.lookup
^^^
SyntaxError: Unexpected token '??='
at wrapSafe (internal/modules/cjs/loader.js:984:16)
at Module._compile (internal/modules/cjs/loader.js:1032:27)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1097:10)
at Module.load (internal/modules/cjs/loader.js:933:32)
at Function.Module._load (internal/modules/cjs/loader.js:774:14)
at Module.require (internal/modules/cjs/loader.js:957:19)
at require (internal/modules/cjs/helpers.js:88:18)
at Object.<anonymous> (C:\Program Files\nodejs\node_global\node_modules\npm\node_modules\@npmcli\agent\lib\index.js:7:15)
at Module._compile (internal/modules/cjs/loader.js:1068:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1097:10)Node.js和npm这两家伙怎么又在闹别扭了？咱们可不可以好好相处，跳出这个无尽的误解循环呢？
这报错还是说现在的npm版本（v10.2.5）与Node.js的版本（v14.17.0）不太般配，这就涉及到一个问题呢，它们都是互相有依赖的，对方的版本发生变化，自身也得跟着调整。当你在降级 Node.js 的同时，可能还需要把 npm 也往回调一调。
最简单粗暴的方法，彻底卸载 Node.js 和 npm 后再重装。一般情况下装回来 Node.js 的时候，npm 也就装回来了，版本上也都会比较匹配。下面是在 windows 环境下的卸载步骤：
- 首先，打开你的“控制面板”，找到“安装/卸载程序”。
- 在列表里找到 Node.js，点击卸载。
- 然后我们还得确认一下，Node.js 是否从你的系统 PATH 中删除了。你可以打开一个命令行窗口，输入 ‘node’ 看看，如果它说找不到命令的话，那就对了。
- 到这 node 应该已经被你的电脑忘记了，然后我们还要记得把 npm 的缓存清理掉，打开命令行，输入 ‘npm cache clean -f’
- 最后，删除你电脑里存放全局包的地方，一般来说路径类似于 ‘C:\Users\你的用户名\AppData\Roaming\npm’ 和 ‘C:\Users\你的用户名\AppData\Roaming\npm-cache’
不不不，我不要这样，我和我的Node.js关系真是好到不能再好，都不舍得和它分开了，那就先试试看升级npm到最新版。
首先，打开PowerShell（命令提示符），以管理员身份运行。
接着运行以下命令安装"npm-windows-upgrade"模块。
npm install --global --production npm-windows-upgrade然后，使用刚刚安装好的"npm-windows-upgrade"工具来升级npm。
npm-windows-upgrade
就选最新的版本就好了，然后静静等待它执行完。
本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2024-01-06，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
babel-loader@8 requires Babel 7.x (the package '@babel/core'). If you'd like to use Babel 6.x ('babe
![Vue学习笔记之opensslErrorStack: [ ‘error:03000086:digital envelope routines::initialization error‘ ]的问题](https://developer.qcloudimg.com/http-save/yehe-1729674/9fc8dab5367c382f99ae8873b4f5cc9f.png)
推荐阅读
相关推荐
Node——activeError: error:0308010C:digital envelope routines::unsupported
更多 >
腾讯云开发者
