报错Unknown custom element ＜xxx＞ - did you register the component correctly的原因及解决办法

最新推荐文章于 2024-05-10 21:37:59 发布
最新推荐文章于 2024-05-10 21:37:59 发布
阅读量1.6w 收藏 4
点赞数 3
分类专栏： 前端 html 文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_67402341/article/details/123396655
版权
前端 同时被 2 个专栏收录
39 篇文章 3 订阅
订阅专栏
html
39 篇文章 0 订阅
订阅专栏
本文探讨了在Vue开发中常见的组件错误，如将`components`误写为`component`，导入组件路径错误，以及组件名重复导致的问题。作者分享了自己的解决经历，提醒开发者检查这些常见错误，并提供了解决方案，帮助遇到类似问题的程序员快速定位并修复错误。
摘要由CSDN通过智能技术生成
报错信息

问题截图

components代码

components

导致出错的可能的原因
  1. 把components写成了component
  2. import xxx from “./xxx.vue” 写成了import { xxx} from “./xxx.vue”
  3. 代码中有两个components，后一个的值把前一个覆盖了
解决方案
  • 逐一对照上述3种可能导致出错原因，然后做对应修改即可解决问题
  • 我是第3个原因，被坑到差点怀疑人生，看到这篇文章的小伙伴你是什么原因？
  • 欢迎补充
m0_67402341
关注
专栏目录
正确解决Unknown custom element: ＜xxx＞ - did you register the component correctly?异常的有效解决方法
wbajsjhhhhh的博客
05-03 4978
正确解决Unknown custom element: - did you register the component correctly?异常的有效解决方法
前端开发：Vue项目报错Unknown custom element：XXX - did you register the component correctly…的解决方法丨蓄力计划
软贱开发攻城狮
05-11 1万+
导读 Vue项目报错Unknown custom element:XXX - did you register the component correctly…的解决方法。 问题 前段时间在做前端项目的时候，遇到了一个关于饿了么框架的报错问题，具体报错信息如下所示： [Vue warn]: Unknown custom element: <table-page> - did you register the component correctly? For recursive c.
Unknown custom element: ＜xxx＞ - did you register the component correctly?异常的解决方案
2301_79779756的博客
05-10 4274
在Vue.js中，当我们在模板中尝试使用一个自定义组件时，Vue需要知道这个组件的定义。如果Vue找不到对应的组件定义，就会抛出一个错误：“Unknown custom element: ＜xxx＞ - did you register the component correctly?这个错误提示我们组件没有正确注册或者没有被Vue识别。
报错Unknown custom element: ＜组件名＞ - did you register the component correctly?的原因及解决办法
chelflan's blog
04-21 11万+
报错Unknown custom element: ＜组件名＞ - did you register the component correctly?的原因及解决办法
10-Vue报错Unknown custom element: <bili-title> - did you register the component correctly?
anxikang5491的博客
06-25 199
Vue报错这个问题，最后发现是引入顺序有问题，需要先导入自定义的组件js文件再把index挂载的js文件放到下面，顺序是先注册后使用 1.Vue.component("my-component",{ template:`<div></div>` }) 2.new Vue({ el:"#app", }) 导入顺序 <script src="...
did you register the component correctly
WU2629409421perfect的博客
07-23 382
did you register the component correctly?
报错Unknown custom element: ＜di＞ - did you register the component correctly? For recursive components,
qq_41180882的博客
01-09 9361
Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option.等几种类似错误
vue报错：Unknown custom element xxx - did you register the component correctly For recursive compon
web15285868498的博客
03-02 7683
文章目录 一、报错信息 二、分析 1.报这种错误可以先检查一下代码规范，模块引入是否加{} 一、报错信息 vue.runtime.esm.js2b0e:619 [Vue warn]: Unknown custom element: - did you register the component correctly For recursive components, make sure to provide the “name” option. 二、分析 1.报这种错误可以先检查一下代码规
【Vue报错】did you register the component correctly
Cao_Mary的博客
06-22 6081
问题描述：Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the “name” option. 报错原因1：:是因为暴露组件的时候加了组件扩展名，导致未识别。 //错误写法： export default { name: 'xxx.vue' } //正确写法 export default { name: 'xxx'
Unknown custom element:＜xxx＞-did you register the component correctly解决方案
qq_71214810的博客
02-02 1734
我知道这个是Chrome 增加了新的事件捕获机制－Passive Event Listeners，这个以前在搞地图是也遇到过，卡死问题可能不仅仅与这个组件的定义有关，还可能涉及到其他组件、数据、路由或其他一些上下文。后面我找到了引入的组件，发现组件中有引入了四个组件，前面两个组件其实是一样的，调的组件内的同一个方法但是传入的参数不一样。循环调用组件时，组件比vue实例后创建，官方文档中是有提到了组件必须先于实例化引入的，所以引入搞成了懒加载，还是无用。这个问题由于没有时间研究，看了下我就就暂时放在这了。
如何解决Vue组件注册错误：Unknown custom element: ＜XXX＞ - did you register the component correctly?
从前端设计到后端实现，从云技术到人工智能，这里分享最新的技术见解和实践经验。一起学习，一起进步！
01-19 3804
我们将详细分析错误的原因，并提供一系列解决方案。通过阅读本文，无论您是Vue初学者还是经验丰富的开发者，都能有效地理解并解决这一问题。文章内容包括组件注册的基础知识、错误产生的原因、以及如何步步解决这一问题。本文关键词包括Vue.js、组件注册、编程错误解决等，以帮助您从百度等搜索引擎轻松找到这篇文章。Vue.js中的组件是独立和可重用的代码块，它们有自己的视图和逻辑。但是，要在Vue应用中使用它们，你必须先正确注册它们。关键点描述组件注册确保组件在使用前已正确注册导入路径。
史上最全:did you register the component correctly?For components, make sure to provide the “name“
芳草萋萋鹦鹉洲哦
04-30 2881
原因一：引入组件时多加了大括号 import Addition from './components/Addition' // 引入组件不需要加{} import { deviceDetail, queryHttpLogs } from '@/api/device' // 引入接口时才加{} 引入组件千万不要加大括号！！ import时加了{}代表引入的是书写路径内的子组件，而非路径文件。比如下面引入接口时，一个文件会export 多个子项，所以当我们引入接口时会加{}。 import { axio
vue启动时报错——did you register the component correctly? For recursive components
Smile_666666的博客
12-07 4011
原来是因为我的组件大小写开头混了，我在template中写的是小写开头的batchnumSelect，但是注册的时候是注册成大写开头，所以导致报错 解决：改成一致即可
Vue报错: did you register the component correctly? For .., make sure to provide the "name" option(已解决）
荒原
06-02 5万+
提示如图 这个问题有三种情况会触发: 1.如果全局注册,组件名称问题: 若是组件名称是大写,Vue会报错. 可以修改为下面两种: 1.修改组件名称为小写,即mycomponent即可解决. 2.如使用局部注册,则是components少写了个s: 3.看看你所渲染的Vue实例是不是在组件前面,若在前面创建实例,则无法读取到后面创建的组件. ps:B主出现...
Vue报错—— Unknown custom element: [mpvue-picker] - did you register the component correctly...解决办法
weixin_43495390的博客
01-15 3937
问题如下: 解决办法： 一，问题分析出自哪里： 首先解析下这个报错是啥意思： “未知的自定义组件：-是否正确注册了该组件？对于递归组件，请确保提供“name”选项…” 这就很清楚了，原来是自定义组件name或者是未正确引入自定义组件； 二：解决问题： 1、是否在页面上注册组件 正确注册组件： 2、是否在页面上引入正确写好的组件（本文以mpvuePicker.vue为例，组件路径：@/compon...
did you register the component correctly? For recursive components, make sure to provide the “name“
贰半的博客
03-21 5884
did you register the component correctly? For recursive components, make sure to provide the "name" option.
did you register the component correctly? For recursive components, make sure to provide the "name"
热门推荐
dt1991524的博客
01-07 18万+
报错截图： 在写一个折叠组件动画，引入该组件时，报了个这样的警告，组件死活引入不到，什么原因呢？ import ball from '../components/ball' export default { component: { 'run-ball': ball } }, //使用 &lt;run-ball :newslist="newslist"&gt;&lt;...
Unknown custom element did you register the component correctly
old_hu的备忘录
11-13 229
这个真是坑爹,搞了我几个小时,什么问题都没就是报这个错,后来我将引入的组件里面内容删了重下写,就好了,我一脸懵逼,是我的vscode坏了还是电脑坏了 ~~~ ...
【vue】 did you register the component correctly...make sure to provide the “name“ option
zhaojingj_的博客
03-17 1566
问题描述 控制台报错：Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the “name” option. 新的改变 我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，帮助你用它写博客： 全新的界面设计 ，将会带来全新的写作体验； 在创作中心设置你喜爱的
uniapp 中 vant组件 Unknown custom element: <include> - did you register the component correctly
最新发布
08-29
`<include>` 标签是uni-app的内置组件，用于引用其他页面片段。出现错误信息 "Unknown custom element: <include> - did you register the component correctly" 通常意味着`<include>`组件没有被正确注册。 在uni-app中使用`<include>`组件时，需要注意以下几点： 1. 确保你的项目是基于uni-app的框架，因为`<include>`是uni-app特有的组件，并不是标准的Web Components。 2. `<include>`标签应该用于引用`.vue`文件。在`.vue`文件中使用`<include>`时，需要指定`src`属性，路径必须是相对路径，并且必须指向当前页面的`.vue`文件。 例如： ```html <template> <view> <!-- 引入当前页面下的 fragment.vue 文件 --> <include src="fragment.vue"></include> </view> </template> <script> // 在页面的脚本部分，通常不需要特别的操作，除非使用了特殊的构建工具配置 </script> <style> /* 页面的样式 */ </style> ``` 3. 如果你是在HBuilderX中开发，确保没有语法错误，并且项目设置正确。在某些情况下，可能是IDE的缓存问题，可以尝试重启HBuilderX或者清除项目缓存。 4. 如果你的项目进行了构建配置，比如使用了Vue CLI插件uni-app，请确保你的`vue.config.js`配置文件中的配置项正确无误，例如`pages`配置正确，以确保正确编译和注册页面。
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值