Laravel Nova Vue component not being rendered

Question

I have a laravel nova package where I define a custom vue component like this:

Nova.booting((Vue, router, store) => {
  Vue.component('my-component', require('./components/MyComponent').default);
});

I use it in a custom field like this:

Number::make('Custom field', function() {
   return view('my-package::custom_field')->render();
})->asHtml()

contents of views/custom_field.blade.php: <my-component></my-component>

the rendered custom field looks like this without vue component being rendered:

<my-component></my-component/>

So how can I define a global vue component that I can render inside a custom html nova field?