两个组件,一个被识别,另一个触发"[Vue warn]:未能解析组件:"警告



由于某些原因,我尝试在没有is="vue:<<component-name>>"的情况下使用两个组件。背景:

•该项目是使用Vue CLI生成的•我正在让Vue动态解析DOM的大部分内容•这两个组件都在SFC.vue文件中,并且都在Vue的defineAsyncComponent()的入口脚本中定义

我想要什么,为了方便:

<div id="app">
<Component></Component>
<ComponentTwo></ComponentTwo>
</div>

我很早就遇到了<Component></Component>语法的问题。这就是我了解到动态编译可能需要(不那么漂亮(<div is="vue:component"></div>语法的地方。

如果是这样的话,没关系。它不是那么漂亮,但不管怎样。到处都有权衡。

但是。当我构建其他组件时,我注意到我可以使用<Component></Component>。耶!令人惊叹的所以,我开始用同样的模式构建下一个。就在那时,我遇到了:

[Vue warn]: Failed to resolve component: componenttwo 
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. 
at <App>

我对其中的区别感到困惑。我甚至把ComponentTwo简化为以下内容,认为我可能在证监会内部做了一些顽皮的事情:

<template>
<div>ComponentTwo</div>
</template>
<script>
import { ref } from "vue";
export default {
name: "ComponentTwo",
setup( props ) {
const Data = ref([]);
return { Data }; 
}
}
</script>

没有爱。

我错过了什么?

UPDATE出于绝望,我尝试将已知的工作组件导入为<ComponentTwo>,但它仍然以完全相同的方式失败。

更新到更新<ComponentTwo>的名称/引用更改为";Baz"——所以主视图模型的components注册表中的"Baz": defineAsyncComponent(() => import("./path/to/component-two.vue"))和标记中的<Baz></Baz>——";固定的";PascalCase的名字会是问题吗?

这是PascalCase,因为我正在解析DOM。如明确规定在Vue Docs DOM模板解析注意事项中。

把这个留在这里,以防其他人正在寻求帮助。

最新更新