如何在 Laravel 项目中为 VueJS 3 设置 compilerOptions.isCustomElement
How to set compilerOptions.isCustomElement for VueJS 3 in Laravel project
我正在 Laravel 项目中使用 VueJS 3,我正在使用一个 JS 文件,它为我提供了用于降价工具栏的元素。基本上它是一组功能,为我提供应用所选降价选项的按钮。一切正常,但我收到了我希望它们消失的控制台错误。
他们都和这一个相似:
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>
这是说 md-linedivider 元素应该通过 compilerOptions.isCustomElement 从组件解析中排除。我真的到处寻找解决方案,我只找到了 this one,但我的 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),
},
},
});
在我的例子中,我有一个名为 view
的全局组件,但我将其用作 View
。这就是我收到警告的原因。
我正在 Laravel 项目中使用 VueJS 3,我正在使用一个 JS 文件,它为我提供了用于降价工具栏的元素。基本上它是一组功能,为我提供应用所选降价选项的按钮。一切正常,但我收到了我希望它们消失的控制台错误。
他们都和这一个相似:
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>
这是说 md-linedivider 元素应该通过 compilerOptions.isCustomElement 从组件解析中排除。我真的到处寻找解决方案,我只找到了 this one,但我的 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),
},
},
});
在我的例子中,我有一个名为 view
的全局组件,但我将其用作 View
。这就是我收到警告的原因。