Vue/Vuetify - 未知的自定义元素：<v-app> - 您是否正确注册了组件？

Question

我是 Vue 和 Vuetify 的新手。我刚刚创建了快速应用程序来检查它们。但我一开始就遇到了问题。尽管遵循了文档中列出的所有步骤，但 vue 无法识别 vuetify 组件。错误如下 -

vue.runtime.esm.js?ff9b:587 [Vue 警告]：未知的自定义元素：-您是否正确注册了组件？对于递归组件，请确保提供“名称”选项。

在发现

—> 在 src\App.vue

您可以在沙盒 https://codesandbox.io/s/40rqnl8kw 访问整个代码

原文由 indusBull 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您可能会遇到操作顺序问题。在您甚至告诉 Vue 使用它之前，您正在定义自己的 App 使用 v-app 组件的组件，因此 Vue 假设您正在使用自己的自定义 v-app 组件。

在通过 new Vue() 启动任何需要 Vuetify 组件的 Vue 实例之前放置 Vue.use(Vuetify) ，或者在导入后将其放置在组件定义本身的 <script> 标签顶部Vue 和 Vuetify 在单个文件组件中。如果您有多个 Vue.use(Vuetify) 语句，请不要担心，因为只有第一个会做任何事情——所有后续调用都不会做任何事情。

---

原来—— Vue.use() 在 new Vue() 之前被调用，导致报错。

 new Vue({
    el: "#app",
    components: { App },
    template: "<App/>"
});

Vue.use(Vuetify);

修复- 在 new Vue() Vue.use() 允许 Vue 正确解决依赖关系。

 Vue.use(Vuetify);

new Vue({
    el: "#app",
    components: { App },
    template: "<App/>"
});

原文由 B. Fleming 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

我最近遇到的这个错误还有另一个原因。

我最近从 Vuetify 1.5 升级到 2.x，即使我在当前接受的答案中的操作顺序正确，我仍然收到关于 v-app 未知的错误：

未知的自定义元素： <v-app> - 您是否正确注册了组件？对于递归组件，请确保提供“名称”选项。

事实证明，升级过程需要在我的 vuetify 1.5x 包中最初不存在的 package.json devDependencies 部分添加以下内容：

 "vuetify-loader": "^1.3.0"

（撰写本文时为 1.3.0 当前版本）

一旦我添加了错误就消失了。

原文由 JohnC 发布，翻译遵循 CC BY-SA 4.0 许可协议