Errors using bundled component
Tommytrg opened this issue · 0 comments
Hello!
I'm using bili to bundle a typescript vue component. I've bundled it but its behavior is not the expected and it's throwing these warnings when it renders:
[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "messages"
[Vue warn]: $attrs is readonly.
I'm installing the library just like that:
src/plugins/vue-simplet-chat.js
import Vue from 'vue'
import Chat from 'vue-simple-chat'
Vue.use(Chat)
And then importing it in my main.js
file like the other external components: import './plugins/vue-simple-chat.js'
On the other hand, I'm running this command to generate the bundle:
yarn bili --format umd,cjs,iife,esm --module-name VueSimpleChat
bili.config.ts
module.exports = {
output: {
extractCSS: false,
},
input: 'src/index.ts',
plugins: {
vue: {
css:false
}
}
}
The entry point is the src/index.ts
file:
src/index.ts
import Chat from './Chat.vue'
export default {
install(Vue: any, options: any) {
Vue.component("vue-simple-chat", Chat);
}
}
AFAIK, those errors appear when are multiple vue
instances. Am I doing something wrong in my build step or when I import the component in a project?
Thank you in advance! 😅