我正在 Laravel 项目中开发 VueJS 3,并且正在使用一个 JS 文件,该文件为我提供了用于 Markdown 工具栏的元素。基本上,它是一组函数,为我提供了应用所选降价选项的按钮。一切工作正常,但我收到了那些我希望它们消失的控制台错误。
它们都与此类似:
Failed to resolve component: md-linedivider
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.
at <Markdowntoolbar>
at <Article onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > >
at <BaseTransition mode="out-in" appear=false persisted=false ... >
at <Transition enter-active-class="animate__animated animate__fadeInLeft" leave-active-class="animate__animated animate__bounceOutUp" mode="out-in" >
at <RouterView>
at <App>
at <Bodycomponent>
at <App>
这就是说,应通过compilerOptions.isCustomElement 将 md-linedivider 元素从组件解析中排除。我真的到处寻找解决方案,但我只找到了this one https://forum.vuejs.org/t/yarnpkg-where-to-set-compileroptions/125040/7但我的 laravel 项目中没有 vue.config.js 来应用它。我尝试在 webpack.mis.js 和 app.js 中执行此操作,但没有成功。
有人有什么想法吗?
在你的试试这个webpack.mix.js
mix.js('resources/assets/js/app.js', 'public/js').vue({
options: {
compilerOptions: {
isCustomElement: (tag) => ['md-linedivider'].includes(tag),
},
},
});
4.8.22 更新 - 对于 Vite 项目:vite.config.js
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
export default defineConfig({
plugins: [
vue({
template: {
compilerOptions: {
isCustomElement: (tag) => ['md-linedivider'].includes(tag),
}
}
})
]
})
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)