Vue3警告:Failed to resolve component:XXX的详细解决办法

 更新时间:2023年05月30日 08:54:59   作者:P9ulp  
最近在一个vue3项目中遇到了报错,整理了些解决办法,这篇文章主要给大家介绍了关于Vue3警告:Failed to resolve component:XXX的详细解决办法,文中介绍的非常详细,需要的朋友可以参考下

今天做小项目的时候遇到的问题,上网参考了几个大佬给出的解决方法

方法一:检查组件是否注册

没有注册组件,注册即可

方法二:检查组件名称是否有误

检查一下组件的名称有没有拼错or大小写有问题

方法三:defineComponent

将vue3中的defineComponent去掉

<script>
import { defineComponent } from "vue";
import layaside from "./Aside";
export default defineComponent({
  components: {
    layaside,
  },
  setup() {
    return {};
  },
});
</script>
<script>
import layaside from "./Aside";
export default {
  components: {
    layaside,
  },
  setup() {
    return {};
  },
};
</script>

后来我查了一下defineComponent主要是TS的时候用处比较大,JS也可以不需要。

方法四:组件互相嵌套

可能是你引用的组件互相嵌套,你中有我,我中有你,此时建议

1、把组件注册成全局组件

2、使用 webpack 的异步 import

components: {
  TreeFolderContents: () => import('./tree-folder-contents.vue')
}

方法五:是否是用对象包裹

以上方法我都试过了,最后解决的办法是将名称外包裹的花括号删除即可

总结

到此这篇关于Vue3警告:Failed to resolve component:XXX的详细解决办法的文章就介绍到这了,更多相关Vue3警告Failed to resolve component:XXX内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • vue 2.0组件与v-model详解

    vue 2.0组件与v-model详解

    这篇文章主要介绍了vue 2.0组件与v-model的相关资料,文中介绍的非常详细,本文适合初学组件编写的同学阅读,需要的朋友可以参考借鉴,下面来一起看看吧。
    2017-03-03
  • vue3结合hooks开发可以注册的二次确认弹框

    vue3结合hooks开发可以注册的二次确认弹框

    这篇文章主要为大家介绍了vue3结合hooks开发可以注册的二次确认弹框,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-12-12
  • Vue3兄弟组件传值之mitt的超详细讲解

    Vue3兄弟组件传值之mitt的超详细讲解

    之前只是浅显的使用插件进行vue开发展示,最近深入的研究了下,下面这篇文章主要给大家介绍了关于Vue3兄弟组件传值之mitt的超详细讲解,需要的朋友可以参考下
    2022-06-06
  • Vue3配置axios跨域实现过程解析

    Vue3配置axios跨域实现过程解析

    这篇文章主要介绍了Vue3配置axios跨域实现过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-11-11
  • Vue封装通用table组件的完整步骤记录

    Vue封装通用table组件的完整步骤记录

    对于一个中后台类的项目,一个比较常见的展示形式就是Table了,这篇文章主要给大家介绍了关于Vue封装通用table组件的相关资料,需要的朋友可以参考下
    2021-07-07
  • v-distpicker地区选择器组件使用实例详解

    v-distpicker地区选择器组件使用实例详解

    代码添加了一个vDistpickerHandle的事件处理函数对地区选择器中的数据进行处理,将数据存储到form对象的相应属性中,方便数据提交,这篇文章主要介绍了v-distpicker地区选择器组件使用,需要的朋友可以参考下
    2024-02-02
  • vue3使用拖拽组件draggable.next的保姆级教程

    vue3使用拖拽组件draggable.next的保姆级教程

    做项目的时候遇到了一个需求,拖拽按钮到指定位置,添加一个输入框,这篇文章主要给大家介绍了关于vue3使用拖拽组件draggable.next的保姆级教程,需要的朋友可以参考下
    2023-06-06
  • 如何搭建一个完整的Vue3.0+ts的项目步骤

    如何搭建一个完整的Vue3.0+ts的项目步骤

    这篇文章主要介绍了如何搭建一个完整的Vue3.0+ts的项目步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-10-10
  • Mint UI实现A-Z字母排序的城市选择列表

    Mint UI实现A-Z字母排序的城市选择列表

    这篇文章主要为大家详细介绍了Mint UI实现A-Z字母排序的城市选择列表,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-12-12
  • Vue使用el-upload批量上传图片时报错问题处理方法

    Vue使用el-upload批量上传图片时报错问题处理方法

    相信大家都知道在element-ui中,el-upload可以进行文件多选操作,下面这篇文章主要给大家介绍了关于Vue使用el-upload批量上传图片时报错问题的处理方法,文中通过图文以及实例代码介绍的非常详细,需要的朋友可以参考下
    2023-06-06

最新评论