【Vue3】引入组件Failed to resolve component: MyButton If this is a native custom element
引入组件时页面上并没有出现组件的影子,其他元素正常,初步确定是组件引入部分语法出了问题,打开开发者工具看到控制台报出错误代码:
Failed to resolve component: MyButton If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.
翻译
无法解析组件:我的按钮如果这是本机自定义元素,请确保通过 compilerOptions.isCustomElement 将其从组件解析中排除。
搜到了博主们提供的一些方法比如:
- 组件的script标签没有添加 setup
- 引入的时候加了大括号之类的,这种情况很显然不会报出这个错误信息,而是下面这个,而且也会影响页面其他元素的加载
Uncaught SyntaxError: The requested module '/components/MyButton.vue?t=1676209371149' does not provide an export named 'MyButton'
最后经过自己的排查,发现问题还是因为导入组件时,在components这一步出了问题导致的
<script>
import MyButton from '../components/MyButton.vue'
export default {
data() {
return {
msg: "我爱vue"
}
},
components: {
MyButton
}
}
</script>
<template>
<h1>{{ msg }}</h1>
<MyButton></MyButton>
<!-- <MyButton></MyButton> -->
</template>
【Vue3】引入组件Failed to resolve component: MyButton If this is a native custom element的更多相关文章
- [vue-router] Failed to resolve async component default: Error: Loading chunk 0 failed.
在整合laravel5.4 和vue2.1的时候遇到一个奇怪的问题 Uncaught SyntaxError: Unexpected token < Error: Loading chunk 0 ...
- Vue-cli3.x在开发环境中(router采用 history模式)出现Failed to resolve async component default: Error: Loading chunk {/d} failed.或者Uncaught SyntaxError: Unexpected token <错误
使用Vue-cli3.x开发环境中(router采用 history模式)出现Failed to resolve async component default: Error: Loading chu ...
- 【Vue.js】vue引入组件报错:该组件未注册?
[Vue warn]: Unknown custom element: <QuestionnaireOption> - did you register the component cor ...
- Tomcat启动报错:org.apache.catalina.LifecycleException: Failed to start component...java.util.zip.ZipException: error in opening zip file
1.项目环境 IntelliJ IDEA2018.1.6 apache-tomcat-8.0.53 基于springboot开发的项目 maven3.5.3 2.出现问题 从svn同步下项目 启动to ...
- ContainerBase.addChild: start: org.apache.catalina.LifecycleException: Failed to start component [StandardEngine[Catalina].StandardHost[localhost].StandardContext[]]
今天第一次遇到Failed to start component [StandardEngine[Catalina].StandardHost[localhost].错误,并且在错误提示的后半段出现了 ...
- Maven使用tomcat7-maven-plugin插件run时出现错误: A child container failed during start java.util.concurrent.ExecutionException: org.apache.catalina.LifecycleException: Failed to start component
错误如下: A child container failed during startjava.util.concurrent.ExecutionException: org.apache.catal ...
- IDEA启动tomcat报错:java.lang.NoClassDefFoundError: org/springframework/context/ApplicationContext、ContainerBase.addChild: start: org.apache.catalina.LifecycleException: Failed to start component
先看错误日志: -May- ::.M26 -May- :: :: UTC -May- ::29.845 信息 [main] org.apache.catalina.startup.VersionLog ...
- VUE3 之 组件传参
1. 概述 韦奇定律告诉我们:大部分人都很容易被别人的话所左右,从而开始动摇.怀疑,最终迷失自我.因此我们要努力的坚定信念,相信自己,才不会被周围的环境所左右,才能取得最终的胜利. 言归正传,之前我们 ...
- Android Studio:Failed to resolve ***
更换电脑后,也更新了所有的SDK的tool,仍然报错:Failed to resolve 各种jar包,出现这种问题主要是因为在Android studio中默认不允许在线更新,修改方法如下:
- Vue.js报错Failed to resolve filter问题原因
Vue.js报错Failed to resolve filter问题原因 金刚 vue Vue.js js javascript 之前使用vue.js写分页功能时,写了一个过滤器,发现一个比较奇怪的错 ...
随机推荐
- PYQT搭建相关记录
class Demo(QWidget): def __init__(self): super(Demo, self).__init__() # 设置标题 icon 尺寸 self.setWindowT ...
- List<dto> 转List<map>
/** * list<DTO> 转 list<Map<String,Object>> * * @param list * @param <T> * @r ...
- mysql 中 insert 大量数据 避免时间戳相同 !!
时间函数 now() current_timestamp() 和 sysdate() CURRENT_TIMESTAMP and CURRENT_TIMESTAMP() are synonyms fo ...
- k8s 关于pull image failed 问题
问题描述: Failed to pull image "nginx": rpc error: code = Unknown desc = failed to pul 解决办法: 1 ...
- SpringBoot笔记--Failed to configure a DataSource: 'url' attribute is not specified and no embedded datasource could be configured.报错的解决
问题描述 写了SpringBoot代码之后,运行不出来结果,报出这样的一个错误:Failed to configure a DataSource: 'url' attribute is not spe ...
- MD5 简介 以及 C# 和 js 实现【加密知多少系列】
〇.简介 MD5 是哈希算法(散列算法)的一种应用.Hash 算法虽然被称为算法,但实际上它更像是一种思想.Hash 算法没有一个固定的公式,只要符合散列思想的算法都可以被称为是 Hash 算法. 算 ...
- 2023最新ELK日志平台(elasticsearch+logstash+kibana)搭建
前言 去年公司由于不断发展,内部自研系统越来越多,所以后来搭建了一个日志收集平台,并将日志收集功能以二方包形式引入自研系统,避免每个自研系统都要建立一套自己的日志模块,节约了开发时间,管理起来也更加容 ...
- Python Web开发初试,基于Flask
目录 关于web框架 Python flask使用 关于web框架 仅仅对于应用层的coder而言,web框架的使用其实就是写路由,分发路由,写输出.当然如果要安全,要测试,要写优秀的接口,那需要继续 ...
- 如何理解redis两种不同的持久化方式
其实redis就是一种高级的以键值对形式存储数据的数据库,而它的好处就是他可以支持数据的持久化,其实redis之所以会有这样的优点,主要是因为,redis的数据都是存放在内存中的,如果不配置持久化,那 ...
- 教你如何用纯css代码实现太极阴阳鱼动画效果
今天看到一个有意思的效果,闲来无事做一个: 把2d静态的太极图改成了3d,阴极和阳极分到了两个平面里实现旋转效果,这个好实现,重点是实现它的透明效果,平面太极图显示出两极是用另加的块元素挡住底面的颜色 ...