Vue Vite Rollup: Dynamic import not works on production build-CodePudding

I'm trying to use Vite with dynamic-import Vue SFCs, but not work on production build.

There is stackblitz example:

https://stackblitz.com/edit/vitejs-vite-ant1g2?file=src/main.ts

Test command and localhost:3000 shows good.

vite

However preview and localhost:4173 shows blank.

vite build && vite preview

What is wrong? Do you have any solutions?

CodePudding user response：

With standard import it works without a problem:

main.ts

import { createApp } from 'vue'
import App from './App.vue'

console.log('start app')
createApp(App).mount('#app')

Why do you want to import dynamically?

CodePudding user response：

Use defineAsyncComponent.

https://stackblitz.com/edit/vitejs-vite-pmqny3?file=src/main.ts

import { createApp, defineAsyncComponent } from 'vue';

console.log('start app');
createApp(defineAsyncComponent(() => import('./App.vue'))).mount('#app');

Thanks for https://misskey.dev/notes/8zjl4hnyz5