Closed
Description
Version
3.5.1
Environment info
Unknown command info.
Steps to reproduce
I am trying to build a common ui library based on vuetify.
I created a generic vuetify button and tried to bundle it using vue-cli3.
Then, I import the package into another project.
My issue is that the new
Created a new button in 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>
And on index.js:
import gBtn from './components/Forms/gBtn.vue'; // import vue file
const Components = {
gBtn
};
export default Components;
export {
gBtn
};
And then I run this command using vue-cli3:
vue-cli-service build --target lib --name ui-core ./src/index.js
npm link
On the target project I import the button:
<template>
<gBtn></gBtn>
</template>
<script>
import { gBtn } from 'ui-core';
export default {
name: 'create-market',
components: {
gBtn,
},
};
</script>
What is expected?
<button type="button" class="v-btn theme--light success">
<div class="v-btn__content">Success</div>
</button>
What is actually happening?
<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>
Metadata
Metadata
Assignees
Labels
No labels