How to register local components with defineComponent in VueJS 3.0

Question

VueJS 3.0 provides new syntax for defining component

(https://v3.vuejs.org/api/global-api.html#arguments-3).

import { defineComponent, ref } from 'vue'

const HelloWorld = defineComponent(function HelloWorld() {
  const count = ref(0)
  return { count }
})

How to locally register components with passing function to defineComponent?

In old style you are to use components field in component definition object like this:

import ComponentA from './ComponentA.vue'

export default {
  components: {
    ComponentA
  }
  // ...
}

Answer 1

You could do it simply as before by adding that component to components option :

import ComponentA from './ComponentA.vue'

export default defineComponent({
    setup() {
        const count = ref(0)
        return { count }
    },

    components: {
        ComponentA 
    }
});

LIVE DEMO