Be able to declare async components

Currently I can declare a component like

@Component()
export default class MyComponent extends Vue {

}

which is analogous to

Vue.component('my-component', { /* ... */ });

However if I wish to create an Async Component there is currently no way to declare it.

What I would expect to see (as a new player) is something like

@AsyncComponent({
  init: doSomethingThatReturnsAPromise()
})
export default class MyComponent extends Vue {

}

or maybe have the init function be a static member on the class (my preference)

@AsyncComponent()
export default class MyComponent extends Vue {
  public static defininition(): Promise {
    // return a promise that does some async thing and resolves
  }
}

[LinusBorg]

which is analogous to

Vue.component('my-component', { /* ... */ });`

No. It’s analogous to:

Vue.extend({ /* .. */ })

• Vue.extend() returns a new Vue constrcutor with the provided options as defaults (a “component”)
• Vue.component() registers a new component globally with the main Vue contructor

---

Async Components are not a different “type” of component. They are just normal components wrapped in a function that imports them via a dynamic import:

const MyAsyncComponent = () => import('./myNormalComponent')

So you can’t really create an async component with a decorator or anything. you have to create a normal component in its own file and then import it as an async compont by wrapping it in such a function.

And it doesn’t matter if you use vue-class-component or not.

You can find documentation about this here: https://vuejs.org/v2/guide/components-dynamic-async.html#Async-Components

[zealotrahl]

Hi all, any updates? I have a same issue…

I solved using, https://github.com/vuejs/composition-api defineAsyncComponent(() => import(@/views/${componentPath}.vue)