refactor(framework): improve framework loading

Author: ije

framework/react/bootstrap.ts

@@ -36,9 +36,9 @@ export default async function bootstrap(options: Options) {
     const imports = await Promise.all(pageModuleChain.map(async mod => {
         const [{ default: Component }] = await Promise.all([
             importModule(baseUrl, mod),
-            mod.asyncDeps?.filter(({ isData }) => !!isData).length ? loadPageDataFromTag(url) : Promise.resolve(),
-            mod.asyncDeps?.filter(({ isStyle }) => !!isStyle).map(dep => importModule(baseUrl, dep)) || Promise.resolve()
-        ].flat())
+            mod.asyncDeps?.filter(({ isData }) => !!isData).length ? loadPageDataFromTag(url) : Promise.resolve()
+        ])
+        await Promise.all(mod.asyncDeps?.filter(({ isStyle }) => !!isStyle).map(dep => importModule(baseUrl, dep)) || [])
         return {
             url: mod.url,
             Component,

framework/react/router.ts

@@ -46,8 +46,8 @@ export default function Router({
                 const [{ default: Component }] = await Promise.all([
                     importModule(baseUrl, mod, e.forceRefetch),
                     mod.asyncDeps?.filter(({ isData }) => !!isData).length ? loadPageData(url) : Promise.resolve(),
-                    mod.asyncDeps?.filter(({ isStyle }) => !!isStyle).map(dep => importModule(baseUrl, dep)) || Promise.resolve()
                 ])
+                await Promise.all(mod.asyncDeps?.filter(({ isStyle }) => !!isStyle).map(dep => importModule(baseUrl, dep)) || [])
                 return {
                     url: mod.url,
                     Component

framework/react/util.ts

@@ -50,7 +50,7 @@ export function importModule(baseUrl: string, mod: { url: string, hash: string }
     }
 
     if (ALEPH && mod.url.startsWith('/pages/')) {
-        const src = util.cleanPath(baseUrl + '/_aleph/' + trimPageModuleExt(mod.url) + `.${util.shortHash(mod.hash)}.js`)
+        const src = util.cleanPath(baseUrl + '/_aleph/' + trimPageModuleExt(mod.url) + `.bundle.${util.shortHash(mod.hash)}.js`)
         return new Promise((resolve, reject) => {
             const script = document.createElement('script')
             script.onload = () => {