refactoring

host/nuxt.config.ts

@@ -18,5 +18,8 @@ export default defineNuxtConfig({
     build: {
       target: "esnext"
     }
+  },
+  experimental: {
+    asyncEntry: true
   }
 })

host/pages/contact/[...all].vue

@@ -2,16 +2,14 @@
   <div class="container mx-auto p-4">
     <h1 class="text-2xl font-bold mb-4">Contact page (Host)</h1>
     <div class="grid grid-cols-1 gap-4">
-      <div class="rmt">
-        <Suspense>
-          <template #default>
-            <RemoteContactRouter />
-          </template>
-          <template #fallback>
-            <div>Loading remote component...</div>
-          </template>
-        </Suspense>
-      </div>
+      <Suspense>
+        <template #default>
+          <RemoteContactRouter />
+        </template>
+        <template #fallback>
+          <div>Loading remote component...</div>
+        </template>
+      </Suspense>
     </div>
   </div>
 </template>
@@ -20,7 +18,7 @@
 import { defineAsyncComponent } from "vue"
 
 const RemoteContactRouter = defineAsyncComponent(() =>
-  import("remote/ContactRouter")
+  import("remote/RemoteContactRouter")
 )
 </script>