vue-router踩坑分享

最新推荐文章于 2024-09-26 11:47:43 发布
最新推荐文章于 2024-09-26 11:47:43 发布
阅读量292 收藏
点赞数
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_57091046/article/details/129870749
版权
文章描述了一个关于Vue应用程序在运行时遇到router-view组件解析失败的错误。问题根源在于main.ts文件中的应用挂载部分存在错误。通过将挂载代码修改为app.mount(#app)，问题得到了解决，表明原来的挂载配置可能没有正确排除本地自定义元素。
摘要由CSDN通过智能技术生成

控制台提示

 

解析router-view组件失败

如果这是一个本地自定义元素，请确保通过compilerOptions.isCustomElement将其排除在组件解析之外

经检查最后结果是主文件入口main.ts中的挂载有问题

错误的

 改为 app.mount('#app') 后正常了

 

我叫wsw
关注
基于vue-cli vue-router搭建底部导航栏移动前端项目
01-21
vue.js学习 踩坑第一步 1.首先安装vue-cli脚手架 不多赘述，主要参考 Vue 爬坑之路（一）—— 使用 vue-cli 搭建项目   2.项目呈现效果 项目呈现网址：www.zhoupeng520.cn/index.html  项目中主要用了Flex布局，...
详解express使用vue-router的history踩坑
01-01
vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL 改变时，页面不会重新加载。 如果不想要很丑的 hash，我们可以用路由的 history 模式，这种模式充分利用 history.pushState API...
报错：make sure to exclude it from component resolution via compilerOptions.isCustomElement.
melissaomy的博客
01-21 3355
element-plus
Vue3解决：[Vue warn]: Failed to resolve component: el-table(或el-button) 的三种解决方案
狮子座的男孩
06-29 3万+
等组件，却发现页面一直再 Vue warn。，且在页面上一直显示不出来自己想要的结果；想完整引入 ElementPlus ui。// 没实测过，因为我使用 vue3。库，并想使用 el-table。通过方式一、方式二和方式三后，或 el-button。的代码风格不是如此;
der If this is a native custom element, make sure to exclude it from component resolution via compil
最新发布
m0_57741466的博客
09-26 358
需要注意的是，在 Vue.js 的开发中，这个警告是非常常见的，因为 Vue 的组件系统是非常灵活和动态的。所以，在遇到这个警告时，不要慌张，仔细检查代码，找到未定义的组件并进行注册和导入就可以了。在 Vue 应用中，当引入未定义的组件时， Vue 会尝试展示更多的警告，这个警告便是其中之一。在应用程序中，每个组件都必须有唯一的名字，如果组件名字不正确，就会出现这个警告，因为 Vue 无法正确识别组件。为了解决这个警告，我们可以通过检查引入的所有组件，确保它们都被正确地定义并且在应用程序中被注册过。
【Vue3】引入组件Failed to resolve component: MyButton If this is a native custom element
Primice个人空间
02-12 4129
引入组件时在comments这一步出了问题，有可能是单词拼写错误或者其它被忽略的细节问题
vite配置isCustomElement
漫漫L路的博客
11-01 5872
配置isCustomElement是为了支持原生自定义元素。如果自定义的标签不是vue组件的话，编译器在解析的时候会抛出错误提示。需要做以下配置。 vite.config.js export default defineConfig({ plugins: [vue({ template:{ // 添加以下内容 compilerOptions:{ isCustomElement: tag => tag.startsWith('ion-')
浅谈vue项目4rs vue-router上线后history模式遇到的坑
10-17
在Vue项目中，Vue Router提供两种导航守卫模式：`hash`模式和`history`模式。本文主要讨论在采用`history`模式时遇到的问题及解决方案。 `history`模式相较于`hash`模式，其优势在于路径更加美观，不含有`#`符号。...
Express与Vue-router history模式踩坑指南
"这篇文章主要讲解了在Express框架中如何配合Vue-Router使用history模式时遇到的问题及解决策略。Vue-Router有两种模式：hash模式和history模式。默认的hash模式通过URL的hash值来实现页面路由的改变，而无需页面...
Vue 忽略自定义标签名&插件开发&组件数据传递和共享—＞父传子
m0_62168050的博客
09-15 1009
Vue 忽略自定义标签名&插件开发&组件数据传递和共享—>父传子
[Vue warn]: Failed to resolve component:XXX
一只小网虫的博客
05-18 3040
Vue3 setup 语法糖中使用递归组件，提示组件无法解析……
vue 报警告：Failed to resolve component:ConsTtem IFthis is a native custom element,make sure to exclude
热门推荐
从事前端，不断积累经验，学习新的技术。头像不是本人是莉莉崽（美貌、可爱集于一身的小姐姐，小仙女），一个宝藏博主，值得喜欢！
06-17 9万+
Failed to resolve component:ConsTtem IFthis is a native custom element,make sure to exclude it from component resolution via cpmpilerOptions.isCustomElement at xxx .翻译一下就是：未能解析组件：constem如果此元素是本机自定义元素，请确保将其从组件中排除通过cpmpilerOptions.isCustomElement 在 xxx 组件（下面
uniapp 报警告 If this is a native custom element, make sure to exclude it from component的问题
打不死的小五
09-19 7244
但是在uniapp中有自动导入机制，只要按需使用即可，easycom会自动导入注册，按照官方的组件目录放置自定义组件。放置准确后，是最重要的一步，检查easycom是否开启了。如果是这一点，放在vue中一般是没有在页面中注册导致。该警告说明在模板中使用了一个无法自动识别的标签。如果是第一点原因，自己仔细检查拼写错误即可。，查看是否有配置项，没有的话就添加进去，因为手误写错了，这个要自己仔细检查。导入、注册、使用，缺一不可。使用了自定义组件/第三组件。
Vue3.0的setup函数
前端打工人的博客
10-21 2800
setup函数的特性： 使用Composition API 的入口 在beforeCreate之前调用 在setup中没有this 可以返回一个对象，这个对象的属性被合并到渲染上下文，并可以在模板中直接使用； 接收props对象作为第一个参数，接收来的props对象，可以通过watchEffect监视其变化。 接受context对象作为第二个参数，这个对象包含attrs，slots，emit三个属性。 setup 函数是个新的入口函数，相当于 vue2.x 中 beforeCreate 和 create
Taro 正式发布 3.4 版本: 全面支持 Preact & Vue 3.2
凹凸实验室
01-20 2325
距 Taro v3.4 beta 版本的发布已有一段时间，期间我们完善了对 Preact 和 Vue3 的支持，加入了一些有趣的特性，更是对 H5 作了大幅度的优化与调整，并于近期发布了 v3.4 的正式版本。 上月我们还推出了支持开发鸿蒙应用的 v3.5.0 canary 版本，欢迎各位同学关注~ 一、支持使用 Preact 开发小程序应用时我们经常会受到包体积的掣肘，大型应用常常为了“尺土寸金”的包体积开展瘦身行动。在此背景下 React 将近 100k 的体积则显得有点过于奢侈。因此 Taro v
vue3[Vue warn]: Failed If this is a native custom element, ...... via compilerOptions.CustomElement.
weixin_44762078的博客
07-28 407
正确引入
vue报错If this is a native custom element
akun的博客
04-18 6813
component忘了加s。
element-plus无法使用图标
JIME_Y的博客
12-28 2571
最近在使用element-plus时遇见的问题：在使用element-ui时直接使用框架里的标签类名，图标就可以直接使用，在element-plus中却不能正常显示 源码： <el-input placeholder="Pick a date"> <template #suffix> <el-icon class="el-input__icon"><calendar /></el-icon> </templat..
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值