@lamebear Are any of your changes portable to current version? Would be best to prepare current version for migration and then have just a small diff for Vue3, rather than a huge one.

Just to be clear, we're aiming for bootstrap-vue to be usable with Vue 3, with minimal changes, right? Migration to Vue 3 APIs would be a different, large project.

eg

The event system has changed, so all calls to this.$once and this.$on need to be reworked

Nope, only Vue.$on was removed. Components can still use this.$on. I just tested this. If Vue.$on is used, as an event bus, that can be replaced with mitt npm now.

Sample code generated by vite & modified:
HelloWorld.vue

<template>
  <h1>{{ msg }}</h1>
  <button @click="clickHandler()">count is: {{ count }}</button>
  <p>Edit <code>components/HelloWorld.vue</code> to test hot module replacement.</p>
</template>

<script>
export default {
  name: 'HelloWorld',
  props: {
    msg: String
  },
  data() {
    return {
      count: 0
    }
  },
	methods: {
 		clickHandler() {
			this.count++
			this.$emit('hello', {count: this.count})
		    }
	}


}
</script>

App.vue

<template>
  <img alt="Vue logo" src="./assets/logo.png" />
  <HelloWorld msg="Hello Vue 3.0 + Vite" @hello="hello()" />
</template>

<script>
import HelloWorld from './components/HelloWorld.vue'

export default {
  name: 'App',
  components: {
    HelloWorld
  },

	methods: {
		hello() {
			console.log('hello event')
		}	
	
	}
}
</script>

Uh oh!

Vue 3 support #5196

Description

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions