why my vuejs component does not render, i need a library?

Question

i have this component, its a simple component, but does not render, just i see words "Sales", i need to install another library?

<template>
  <v-app>
    <v-container>
      <v-row dense align="stretch">
        <v-col cols="4">
          <v-card min-height="100%">
            <v-card-text class="green--text">
              <h5 class="text-truncate text-uppercase">Sales</h5>

            </v-card-text>
          </v-card>
        </v-col>
      </v-row>
    </v-container>
  </v-app>
</template>

<script>
  export default {
    name: 'Taps',
    setup() {
    },
  }
</script>

my dependencies are:

"vue": "^3.2.20",
    "vue-router": "^4.0.0-0",
    "vue3-perfect-scrollbar": "^1.5.5",
    "vuex": "^4.0.0-0",

Answer 1

Unfortunately Vuetify does not yet support Vue 3 .

The current version of Vuetify does not support Vue 3. Support for Vue 3 will come with the release of Vuetify v3. When creating a new project, please ensure you selected Vue 2 from the Vue CLI prompts, or that you are installing to an existing Vue 2 project.

You'll need to downgrade your Vue version or choose a different component library. Quasar is a great alternative to Vuetify with lots of the same components and features.