Question

我正在尝试基于vuetify构建通用的ui库。我创建了一个通用的vuetify按钮，并尝试使用vue-clie3将其捆绑。然后，我将该包导入另一个项目。我的问题是，新的

在gBtn.vue中创建了一个新按钮：

  <template>
      <v-container grid-list-xl fill-height>
        <v-layout column>
          <v-flex xs2>
            <div>Hello</div>
              <v-btn color="success">Success</v-btn>
          </v-flex>
        </v-layout>
      </v-container>
    </template>

在index.js上：

import gBtn from './components/Forms/gBtn.vue'; // import vue file

const Components = {
  gBtn
};

export default Components;
export {
  gBtn
};

然后我使用vue-cli3运行此命令：

vue-cli-service build --target lib --name ui-core ./src/index.js

npm link

在目标项目上，我导入按钮：

<template>
  <gBtn></gBtn>
</template>

<script>
import { gBtn } from 'ui-core';

export default {
  name: 'create-market',
  components: {
    gBtn,
  },
};
</script>

结果是：

<div class="container fluid pa-0 ma-0">
  <div data-v-6f7ae281="" class="container grid-list-xl fill-height">
    <div class="layout column">
      <div class="flex xs2"><div>Hello</div>
      </div>
    </div>
  </div>
</div>

您可以看到，缺少Vuetify按钮。

任何人都曾经经历过吗？

使用vuecli3捆绑vuetify组件的问题

0 个答案: