Javascript vuetifyjs nuxt:无法添加任何UI组件

我正在使用初学者模板

它正确启动，但是当我尝试将UI组件添加到

组件内部时，出现以下错误：

未知自定义元素：-您是否注册了该组件 正确地对于递归组件，请确保提供“名称” 选择权

事实上，每当我想添加UI组件（）时，就会发生这种情况。我错过了什么

编辑：

从文件：

我想补充：

<v-badge left>
        <span slot="badge">6</span>
        <v-icon
          large
          color="grey lighten-1"
        >
          shopping_cart
        </v-icon>
      </v-badge>

6.
购物车

内部

如下：

<template>
    <!-- rest of code -->
    <v-toolbar fixed app :clipped-left="clipped">
      <v-toolbar-side-icon @click="drawer = !drawer"></v-toolbar-side-icon>
      <v-btn
        icon
        @click.stop="miniVariant = !miniVariant"
      >
        <v-icon v-html="miniVariant ? 'chevron_right' : 'chevron_left'"></v-icon>
      </v-btn>

       <!-- Added here -->

        <v-badge left>
    <span slot="badge">6</span>
    <v-icon
      large
      color="grey lighten-1"
    >
      shopping_cart
    </v-icon>
  </v-badge>
      <!-- end of the badge I added -->
      <v-btn
        icon
        @click.stop="clipped = !clipped"
      >
        <v-icon>web</v-icon>
      </v-btn>
      <v-btn
        icon
        @click.stop="fixed = !fixed"
      >
        <v-icon>remove</v-icon>
      </v-btn>
      <v-toolbar-title v-text="title"></v-toolbar-title>
      <v-spacer></v-spacer>
      <v-btn
        icon
        @click.stop="rightDrawer = !rightDrawer"
      >
        <v-icon>menu</v-icon>
      </v-btn>
    </v-toolbar>
    </v-app>
</template>

6.
购物车
网状物
去除
菜单

它看起来像是在项目创建过程中选择的。这意味着只导入使用的组件。因此，如果您想使用其他组件，则需要转到plugins/vuetify.js并将其添加到那里。或者，如果你将其全部移除，只留下

Vue.use(Vuetify)

---

并从nuxt.config中删除转换导入。所有组件都将可用。但它也会像预期的那样增加捆绑包的大小

如果没有任何示例代码说明您是如何操作的，那么很难为您提供帮助。只有在添加

v-badge

时才会出现错误？您是否首先导入了该组件？请添加脚本标记以了解您是否导入了Badge组件。@BillalBEGUERADJ您在项目创建期间选择了点菜设置，对吗？我不确定默认情况下是否导入了该组件。您可能正在使用

a-la-carte

，因此您必须手动注册所有内容。好的，我将在不选择

a-la-carte

选项的情况下进行新的安装，希望这能起作用。我马上会读到这个链接。非常感谢你