Static GitHub Issues

[2198] import of async components

prev: css is not loaded when javascript is disabled in the browser
next: how import jquery plugins in nuxt js

Hi all, thanks for nuxt! I love this project. Still figuring out the feature rich possibilties with it, especially also with vue itself. Now I'm kinda stuck with "async components" and as I couldn't find a related post I thought this could - in case it gets answered ;) - help other people as well.

I've tried to use the syntax mentioned here: https://vuejsdevelopers.com/2017/07/17/vue-js-2-4-important-features/ to load components asynchronous.

import SyncComponent from './SyncComponent.vue';
const AsyncComponent = import('./AsyncComponent.vue');

export default {
  components: {
    SyncComponent,
    AsyncComponent
  }
}

The befenit of this style should be that SSR stil works, but on the client it get's laoded via ajax. Unfortnautely this does not work. The AsyncComponent is not found in this case.

What does work though is const AsyncComponent = () => import('~/AsyncComponent.vue');

But then as far as I can tell, SSR is not working.

any idea how to accomplish this correctly with nuxt? Or why it does not work by default? Has nuxt regardings async components something else to keep in mind?

Thanks Simon

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1939">#c1939</a>)</em></sub></div>