仅将 Vuetify 数据表组件添加到现有的 Vuejs 项目中答案

【问题标题】：Add only Vuetify data table component to existing Vuejs Project仅将 Vuetify 数据表组件添加到现有的 Vuejs 项目中
【发布时间】：2021-05-07 10:44:05
【问题描述】：

我需要将 Vuetify Data Table 添加到我现有的 Vuejs 项目中。因此，当我们添加 vue add vuetify 时，它会全局安装。请帮助我如何做到这一点

谢谢

【问题讨论】：

标签： vue.js vuetify.js

【解决方案1】：

您可以单独导入dataTable 组件。您可以在 vuetify.js 文件中执行此操作：

// src/plugins/vuetify.js

import Vue from 'vue'
import Vuetify, {
  VDataTable,
} from 'vuetify/lib'

Vue.use(Vuetify, {
  components: {
    VDataTable,
  },
})

const opts = {}

export default new Vuetify(opts)

并在您的main.js 中导入此文件：import vuetify from @/src/plugins/vuetify.js

或者你可以在你需要的组件中导入它：

<!-- Vue Component -->

<template>
  <v-card>
    <v-card-title>...</v-card-title>
    <v-card-text>...</v-card-text>
  </v-card>
</template>

<script>
  import { VDataTable } from 'vuetify/lib'

  export default {
    components: {
      VDataTable,
    }
  }
</script>

你可以在vuetify docs阅读更多相关信息

【讨论】：

我需要先“npm install vuetify”对吗？
是的，你必须安装它
嗨，它给了我 sass-loader 问题，如果你有这样的经历？
到底是什么问题？