Major Refactoring. Test update

bun.lock

@@ -19,19 +19,15 @@
         "micromatch": "^4.0.8",
         "ora": "^9.0.0",
         "postcss": "^8.5.8",
+        "tailwindcss": "^4.2.2",
       },
       "devDependencies": {
         "@testing-library/dom": "^10.4.1",
-        "@testing-library/react": "^16.3.2",
         "@types/lodash": "^4.17.24",
         "@types/micromatch": "^4.0.10",
         "happy-dom": "^20.8.4",
-        "react": "^19.2.4",
-        "react-dom": "^19.2.4",
       },
       "peerDependencies": {
-        "react": "^19.0.0",
-        "react-dom": "^19.0.0",
         "typescript": "^5.0.0",
       },
     },
@@ -163,8 +159,6 @@
 
     "@testing-library/dom": ["@testing-library/dom@10.4.1", "", { "dependencies": { "@babel/code-frame": "^7.10.4", "@babel/runtime": "^7.12.5", "@types/aria-query": "^5.0.1", "aria-query": "5.3.0", "dom-accessibility-api": "^0.5.9", "lz-string": "^1.5.0", "picocolors": "1.1.1", "pretty-format": "^27.0.2" } }, "sha512-o4PXJQidqJl82ckFaXUeoAW+XysPLauYI43Abki5hABd853iMhitooc6znOnczgbTYmEP6U6/y1ZyKAIsvMKGg=="],
 
-    "@testing-library/react": ["@testing-library/react@16.3.2", "", { "dependencies": { "@babel/runtime": "^7.12.5" }, "peerDependencies": { "@testing-library/dom": "^10.0.0", "@types/react": "^18.0.0 || ^19.0.0", "@types/react-dom": "^18.0.0 || ^19.0.0", "react": "^18.0.0 || ^19.0.0", "react-dom": "^18.0.0 || ^19.0.0" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-XU5/SytQM+ykqMnAnvB2umaJNIOsLF3PVv//1Ew4CTcpz0/BRyy/af40qqrt7SjKpDdT1saBMc42CUok5gaw+g=="],
-
     "@types/aria-query": ["@types/aria-query@5.0.4", "", {}, "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw=="],
 
     "@types/braces": ["@types/braces@3.0.5", "", {}, "sha512-SQFof9H+LXeWNz8wDe7oN5zu7ket0qwMu5vZubW4GCJ8Kkeh6nBWUz87+KTz/G3Kqsrp0j/W253XJb3KMEeg3w=="],
@@ -291,16 +285,10 @@
 
     "pretty-format": ["pretty-format@27.5.1", "", { "dependencies": { "ansi-regex": "^5.0.1", "ansi-styles": "^5.0.0", "react-is": "^17.0.1" } }, "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ=="],
 
-    "react": ["react@19.2.4", "", {}, "sha512-9nfp2hYpCwOjAN+8TZFGhtWEwgvWHXqESH8qT89AT/lWklpLON22Lc8pEtnpsZz7VmawabSU0gCjnj8aC0euHQ=="],
-
-    "react-dom": ["react-dom@19.2.4", "", { "dependencies": { "scheduler": "^0.27.0" }, "peerDependencies": { "react": "^19.2.4" } }, "sha512-AXJdLo8kgMbimY95O2aKQqsz2iWi9jMgKJhRBAxECE4IFxfcazB2LmzloIoibJI3C12IlY20+KFaLv+71bUJeQ=="],
-
     "react-is": ["react-is@17.0.2", "", {}, "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w=="],
 
     "restore-cursor": ["restore-cursor@5.1.0", "", { "dependencies": { "onetime": "^7.0.0", "signal-exit": "^4.1.0" } }, "sha512-oMA2dcrw6u0YfxJQXm342bFKX/E4sG9rbTzO9ptUcR/e8A33cHuvStiYOwH7fszkZlZ1z/ta9AAoPk2F4qIOHA=="],
 
-    "scheduler": ["scheduler@0.27.0", "", {}, "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q=="],
-
     "signal-exit": ["signal-exit@4.1.0", "", {}, "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw=="],
 
     "source-map-js": ["source-map-js@1.2.1", "", {}, "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA=="],

dist/commands/build/index.js

@@ -3,18 +3,26 @@ import allPagesBundler from "../../functions/bundler/all-pages-bundler";
 import { log } from "../../utils/log";
 import init from "../../functions/init";
 import rewritePagesModule from "../../utils/rewrite-pages-module";
+import allPagesBunBundler from "../../functions/bundler/all-pages-bun-bundler";
+import { execSync } from "child_process";
+import grabDirNames from "../../utils/grab-dir-names";
+const { HYDRATION_DST_DIR, BUNX_CWD_PAGES_REWRITE_DIR } = grabDirNames();
 export default function () {
     return new Command("build")
         .description("Build Project")
         .action(async () => {
         process.env.NODE_ENV = "production";
         process.env.BUILD = "true";
+        try {
+            execSync(`rm -rf ${HYDRATION_DST_DIR}`);
+            execSync(`rm -rf ${BUNX_CWD_PAGES_REWRITE_DIR}`);
+        }
+        catch (error) { }
         await rewritePagesModule();
         await init();
         log.banner();
         log.build("Building Project ...");
-        allPagesBundler({
+        // await allPagesBunBundler();
-            exit_after_first_build: true,
+        allPagesBundler();
-        });
     });
 }

dist/commands/dev/index.js

@@ -3,12 +3,20 @@ import startServer from "../../functions/server/start-server";
 import { log } from "../../utils/log";
 import bunextInit from "../../functions/bunext-init";
 import rewritePagesModule from "../../utils/rewrite-pages-module";
+import { execSync } from "child_process";
+import grabDirNames from "../../utils/grab-dir-names";
+const { HYDRATION_DST_DIR, BUNX_CWD_PAGES_REWRITE_DIR } = grabDirNames();
 export default function () {
     return new Command("dev")
         .description("Run development server")
         .action(async () => {
         process.env.NODE_ENV == "development";
         log.info("Running development server ...");
+        try {
+            execSync(`rm -rf ${HYDRATION_DST_DIR}`);
+            execSync(`rm -rf ${BUNX_CWD_PAGES_REWRITE_DIR}`);
+        }
+        catch (error) { }
         await rewritePagesModule();
         await bunextInit();
         await startServer();

dist/functions/bundler/all-pages-bun-bundler.d.ts

@@ -0,0 +1,5 @@
+type Params = {
+    target?: "bun" | "browser";
+};
+export default function allPagesBunBundler(params?: Params): Promise<void>;
+export {};

dist/functions/bundler/all-pages-bun-bundler.js

@@ -0,0 +1,47 @@
+import grabAllPages from "../../utils/grab-all-pages";
+import grabDirNames from "../../utils/grab-dir-names";
+import isDevelopment from "../../utils/is-development";
+import { log } from "../../utils/log";
+import tailwindcss from "bun-plugin-tailwind";
+const { HYDRATION_DST_DIR } = grabDirNames();
+export default async function allPagesBunBundler(params) {
+    const { target = "browser" } = params || {};
+    const pages = grabAllPages({ exclude_api: true });
+    const dev = isDevelopment();
+    let buildStart = 0;
+    buildStart = performance.now();
+    const build = await Bun.build({
+        entrypoints: pages.map((p) => p.transformed_path),
+        outdir: HYDRATION_DST_DIR,
+        minify: true,
+        format: "esm",
+        define: {
+            "process.env.NODE_ENV": JSON.stringify(dev ? "development" : "production"),
+        },
+        naming: {
+            entry: "[name]/[hash].[ext]",
+            chunk: "chunks/[name]-[hash].[ext]",
+        },
+        plugins: [
+            tailwindcss,
+            {
+                name: "post-build",
+                setup(build) {
+                    build.onEnd((result) => {
+                        console.log("result", result);
+                    });
+                },
+            },
+        ],
+        // plugins: [
+        // ],
+        splitting: true,
+        target,
+        external: ["bun"],
+    });
+    console.log("build", build);
+    if (build.success) {
+        const elapsed = (performance.now() - buildStart).toFixed(0);
+        log.success(`[Built] in ${elapsed}ms`);
+    }
+}

dist/functions/bundler/all-pages-bundler.d.ts

@@ -1,10 +1,8 @@
-import type { BundlerCTXMap } from "../../types";
 type Params = {
-    watch?: boolean;
+    /**
-    exit_after_first_build?: boolean;
+     * Locations of the pages Files.
-    post_build_fn?: (params: {
+     */
-        artifacts: BundlerCTXMap[];
+    page_file_paths?: string[];
-    }) => Promise<void>;
 };
 export default function allPagesBundler(params?: Params): Promise<void>;
 export {};

dist/functions/bundler/all-pages-bundler.js

@@ -1,23 +1,28 @@
-import { readFileSync, writeFileSync } from "fs";
 import * as esbuild from "esbuild";
 import grabAllPages from "../../utils/grab-all-pages";
 import grabDirNames from "../../utils/grab-dir-names";
 import isDevelopment from "../../utils/is-development";
-import { execSync } from "child_process";
 import { log } from "../../utils/log";
 import tailwindEsbuildPlugin from "../server/web-pages/tailwind-esbuild-plugin";
 import grabClientHydrationScript from "./grab-client-hydration-script";
 import grabArtifactsFromBundledResults from "./grab-artifacts-from-bundled-result";
-import stripServerSideLogic from "./strip-server-side-logic";
+import { writeFileSync } from "fs";
-const { HYDRATION_DST_DIR, HYDRATION_DST_DIR_MAP_JSON_FILE, ROOT_DIR } = grabDirNames();
+const { HYDRATION_DST_DIR, HYDRATION_DST_DIR_MAP_JSON_FILE } = grabDirNames();
 let build_starts = 0;
 const MAX_BUILD_STARTS = 10;
 export default async function allPagesBundler(params) {
+    const { page_file_paths } = params || {};
     const pages = grabAllPages({ exclude_api: true });
+    const target_pages = page_file_paths?.[0]
+        ? pages.filter((p) => page_file_paths.includes(p.local_path))
+        : pages;
+    if (!page_file_paths) {
+        global.PAGE_FILES = pages;
+    }
     const virtualEntries = {};
     const dev = isDevelopment();
-    for (const page of pages) {
+    for (const page of target_pages) {
-        const key = page.local_path;
+        const key = page.transformed_path;
         const txt = await grabClientHydrationScript({
             page_local_path: page.local_path,
         });
@@ -37,22 +42,6 @@ export default async function allPagesBundler(params) {
                 loader: "tsx",
                 resolveDir: process.cwd(),
             }));
-            build.onLoad({ filter: /\.tsx$/ }, (args) => {
-                if (args.path.includes("node_modules"))
-                    return;
-                const source = readFileSync(args.path, "utf8");
-                if (!source.includes("server")) {
-                    return { contents: source, loader: "tsx" };
-                }
-                const strippedCode = stripServerSideLogic({
-                    txt_code: source,
-                    file_path: args.path,
-                });
-                return {
-                    contents: strippedCode,
-                    loader: "tsx",
-                };
-            });
         },
     };
     const artifactTracker = {
@@ -65,6 +54,7 @@ export default async function allPagesBundler(params) {
                 if (build_starts == MAX_BUILD_STARTS) {
                     const error_msg = `Build Failed. Please check all your components and imports.`;
                     log.error(error_msg);
+                    process.exit(1);
                 }
             });
             build.onEnd((result) => {
@@ -79,28 +69,27 @@ export default async function allPagesBundler(params) {
                     return;
                 }
                 const artifacts = grabArtifactsFromBundledResults({
-                    pages,
+                    pages: target_pages,
                     result,
                 });
                 if (artifacts?.[0] && artifacts.length > 0) {
-                    global.BUNDLER_CTX_MAP = artifacts;
+                    for (let i = 0; i < artifacts.length; i++) {
-                    global.PAGE_FILES = pages;
+                        const artifact = artifacts[i];
-                    params?.post_build_fn?.({ artifacts });
+                        global.BUNDLER_CTX_MAP[artifact.local_path] = artifact;
+                    }
+                    // params?.post_build_fn?.({ artifacts });
                     writeFileSync(HYDRATION_DST_DIR_MAP_JSON_FILE, JSON.stringify(artifacts));
                 }
                 const elapsed = (performance.now() - buildStart).toFixed(0);
                 log.success(`[Built] in ${elapsed}ms`);
                 global.RECOMPILING = false;
-                if (params?.exit_after_first_build) {
-                    process.exit();
-                }
                 build_starts = 0;
             });
         },
     };
-    execSync(`rm -rf ${HYDRATION_DST_DIR}`);
+    const entryPoints = Object.keys(virtualEntries).map((k) => `virtual:${k}`);
-    const ctx = await esbuild.context({
+    await esbuild.build({
-        entryPoints: Object.keys(virtualEntries).map((k) => `virtual:${k}`),
+        entryPoints,
         outdir: HYDRATION_DST_DIR,
         bundle: true,
         minify: true,
@@ -115,11 +104,6 @@ export default async function allPagesBundler(params) {
         plugins: [tailwindEsbuildPlugin, virtualPlugin, artifactTracker],
         jsx: "automatic",
         splitting: true,
-        logLevel: "silent",
+        // logLevel: "silent",
     });
-    await ctx.rebuild();
-    if (params?.watch) {
-        global.BUNDLER_CTX = ctx;
-        // global.BUNDLER_CTX.watch();
-    }
 }

dist/functions/bundler/grab-artifacts-from-bundled-result.js

@@ -7,12 +7,12 @@ export default function grabArtifactsFromBundledResults({ result, pages, }) {
         .filter(([, meta]) => meta.entryPoint)
         .map(([outputPath, meta]) => {
         const target_page = pages.find((p) => {
-            return meta.entryPoint === `virtual:${p.local_path}`;
+            return meta.entryPoint === `virtual:${p.transformed_path}`;
         });
         if (!target_page || !meta.entryPoint) {
             return undefined;
         }
-        const { file_name, local_path, url_path } = target_page;
+        const { file_name, local_path, url_path, transformed_path } = target_page;
         const cssPath = meta.cssBundle || undefined;
         return {
             path: outputPath,
@@ -25,6 +25,7 @@ export default function grabArtifactsFromBundledResults({ result, pages, }) {
             file_name,
             local_path,
             url_path,
+            transformed_path,
         };
     });
     if (artifacts.length > 0) {

dist/functions/bunext-init.d.ts

@@ -1,7 +1,6 @@
 import { type Ora } from "ora";
 import type { BundlerCTXMap, BunextConfig, GlobalHMRControllerObject, PageFiles } from "../types";
 import type { FileSystemRouter, Server } from "bun";
-import type { BuildContext } from "esbuild";
 import { type FSWatcher } from "fs";
 /**
  * # Declare Global Variables
@@ -15,9 +14,9 @@ declare global {
     var ROUTER: FileSystemRouter;
     var HMR_CONTROLLERS: GlobalHMRControllerObject[];
     var LAST_BUILD_TIME: number;
-    var BUNDLER_CTX: BuildContext | undefined;
+    var BUNDLER_CTX_MAP: {
-    var BUNDLER_CTX_MAP: BundlerCTXMap[] | undefined;
+        [k: string]: BundlerCTXMap;
-    var IS_FIRST_BUNDLE_READY: boolean;
+    };
     var BUNDLER_REBUILDS: 0;
     var PAGES_SRC_WATCHER: FSWatcher | undefined;
     var CURRENT_VERSION: string | undefined;

dist/functions/bunext-init.js

@@ -4,21 +4,20 @@ import { readFileSync } from "fs";
 import init from "./init";
 import isDevelopment from "../utils/is-development";
 import allPagesBundler from "./bundler/all-pages-bundler";
-import serverPostBuildFn from "./server/server-post-build-fn";
 import watcher from "./server/watcher";
-import EJSON from "../utils/ejson";
 import { log } from "../utils/log";
 import cron from "./server/cron";
+import EJSON from "../utils/ejson";
+const { PAGES_DIR, HYDRATION_DST_DIR_MAP_JSON_FILE } = grabDirNames();
 export default async function bunextInit() {
     global.ORA_SPINNER = ora();
     global.ORA_SPINNER.clear();
     global.HMR_CONTROLLERS = [];
-    global.IS_FIRST_BUNDLE_READY = false;
+    global.BUNDLER_CTX_MAP = {};
     global.BUNDLER_REBUILDS = 0;
     global.PAGE_FILES = [];
     await init();
     log.banner();
-    const { PAGES_DIR, HYDRATION_DST_DIR_MAP_JSON_FILE } = grabDirNames();
     const router = new Bun.FileSystemRouter({
         style: "nextjs",
         dir: PAGES_DIR,
@@ -26,10 +25,7 @@ export default async function bunextInit() {
     global.ROUTER = router;
     const is_dev = isDevelopment();
     if (is_dev) {
-        await allPagesBundler({
+        await allPagesBundler();
-            watch: true,
-            post_build_fn: serverPostBuildFn,
-        });
         watcher();
     }
     else {
@@ -39,23 +35,6 @@ export default async function bunextInit() {
             process.exit(1);
         }
         global.BUNDLER_CTX_MAP = artifacts;
-        global.IS_FIRST_BUNDLE_READY = true;
         cron();
     }
-    let bundle_ready_retries = 0;
-    const MAX_BUNDLE_READY_RETRIES = 10;
-    while (!global.IS_FIRST_BUNDLE_READY) {
-        if (bundle_ready_retries > MAX_BUNDLE_READY_RETRIES) {
-            log.error("Couldn't grab first bundle for dev environment");
-            process.exit(1);
-        }
-        bundle_ready_retries++;
-        await Bun.sleep(500);
-    }
-    /**
-     * First Rebuild to Avoid errors
-     */
-    if (is_dev && global.BUNDLER_CTX) {
-        await global.BUNDLER_CTX.rebuild();
-    }
 }

dist/functions/server/handle-hmr.js

@@ -1,11 +1,8 @@
-import grabRouteParams from "../../utils/grab-route-params";
-import grabConstants from "../../utils/grab-constants";
-import grabRouter from "../../utils/grab-router";
 export default async function ({ req }) {
     const referer_url = new URL(req.headers.get("referer") || "");
     const match = global.ROUTER.match(referer_url.pathname);
     const target_map = match?.filePath
-        ? global.BUNDLER_CTX_MAP?.find((m) => m.local_path == match.filePath)
+        ? global.BUNDLER_CTX_MAP[match.filePath]
         : undefined;
     let controller;
     let heartbeat;

dist/functions/server/rebuild-bundler.d.ts

@@ -1 +1,5 @@
-export default function rebuildBundler(): Promise<void>;
+type Params = {
+    target_file_paths?: string[];
+};
+export default function rebuildBundler(params?: Params): Promise<void>;
+export {};

dist/functions/server/rebuild-bundler.js

@@ -1,15 +1,15 @@
 import allPagesBundler from "../bundler/all-pages-bundler";
 import serverPostBuildFn from "./server-post-build-fn";
 import { log } from "../../utils/log";
-export default async function rebuildBundler() {
+export default async function rebuildBundler(params) {
     try {
         global.ROUTER.reload();
-        await global.BUNDLER_CTX?.dispose();
+        // await global.BUNDLER_CTX?.dispose();
-        global.BUNDLER_CTX = undefined;
+        // global.BUNDLER_CTX = undefined;
         await allPagesBundler({
-            watch: true,
+            page_file_paths: params?.target_file_paths,
-            post_build_fn: serverPostBuildFn,
         });
+        await serverPostBuildFn();
     }
     catch (error) {
         log.error(error);

dist/functions/server/server-post-build-fn.d.ts

@@ -1,6 +1 @@
-import type { BundlerCTXMap } from "../../types";
+export default function serverPostBuildFn(): Promise<void>;
-type Params = {
-    artifacts: BundlerCTXMap[];
-};
-export default function serverPostBuildFn({ artifacts }: Params): Promise<void>;
-export {};

dist/functions/server/server-post-build-fn.js

@@ -1,15 +1,18 @@
 import _ from "lodash";
 import grabPageComponent from "./web-pages/grab-page-component";
-export default async function serverPostBuildFn({ artifacts }) {
+export default async function serverPostBuildFn() {
-    if (!global.IS_FIRST_BUNDLE_READY) {
+    // if (!global.IS_FIRST_BUNDLE_READY) {
-        global.IS_FIRST_BUNDLE_READY = true;
+    //     global.IS_FIRST_BUNDLE_READY = true;
-    }
+    // }
-    if (!global.HMR_CONTROLLERS?.[0]) {
+    if (!global.HMR_CONTROLLERS?.[0] || !global.BUNDLER_CTX_MAP) {
         return;
     }
     for (let i = 0; i < global.HMR_CONTROLLERS.length; i++) {
         const controller = global.HMR_CONTROLLERS[i];
-        const target_artifact = artifacts.find((a) => controller.target_map?.local_path == a.local_path);
+        if (!controller.target_map?.local_path) {
+            continue;
+        }
+        const target_artifact = global.BUNDLER_CTX_MAP[controller.target_map.local_path];
         const mock_req = new Request(controller.page_url);
         const { serverRes } = await grabPageComponent({
             req: mock_req,

dist/functions/server/watcher.js

@@ -1,4 +1,4 @@
-import { watch, existsSync, statSync } from "fs";
+import { watch, existsSync } from "fs";
 import path from "path";
 import grabDirNames from "../../utils/grab-dir-names";
 import rebuildBundler from "./rebuild-bundler";
@@ -33,16 +33,11 @@ export default async function watcher() {
         }
         const target_files_match = /\.(tsx?|jsx?|css)$/;
         if (event !== "rename") {
-            if (filename.match(target_files_match) && global.BUNDLER_CTX) {
+            if (filename.match(target_files_match)) {
                 if (global.RECOMPILING)
                     return;
                 global.RECOMPILING = true;
-                if (full_file_path.match(/\_\_root\.tsx?$/)) {
+                await fullRebuild();
-                    // log.watch(`__root.tsx file updated. Reloading window.`);
-                    global.ROOT_FILE_UPDATED = true;
-                }
-                await rewritePagesModule({ page_url: full_file_path });
-                await global.BUNDLER_CTX.rebuild();
             }
             return;
         }
@@ -64,13 +59,16 @@ export default async function watcher() {
     });
     global.PAGES_SRC_WATCHER = pages_src_watcher;
 }
-async function fullRebuild({ msg }) {
+async function fullRebuild(params) {
     try {
+        const { msg } = params || {};
         global.RECOMPILING = true;
+        const target_file_paths = global.HMR_CONTROLLERS.map((hmr) => hmr.target_map?.local_path).filter((f) => typeof f == "string");
+        await rewritePagesModule({ page_file_path: target_file_paths });
         if (msg) {
             log.watch(msg);
         }
-        await rebuildBundler();
+        await rebuildBundler({ target_file_paths });
     }
     catch (error) {
         log.error(error);

dist/functions/server/web-pages/grab-page-bundled-react-component.d.ts

@@ -1,8 +1,8 @@
 import type { GrabPageReactBundledComponentRes } from "../../../types";
 type Params = {
     file_path: string;
-    root_file?: string;
+    root_file_path?: string;
     server_res?: any;
 };
-export default function grabPageBundledReactComponent({ file_path, root_file, server_res, }: Params): Promise<GrabPageReactBundledComponentRes | undefined>;
+export default function grabPageBundledReactComponent({ file_path, root_file_path, server_res, }: Params): Promise<GrabPageReactBundledComponentRes | undefined>;
 export {};

dist/functions/server/web-pages/grab-page-bundled-react-component.js

@@ -1,11 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import grabPageReactComponentString from "./grab-page-react-component-string";
 import grabTsxStringModule from "./grab-tsx-string-module";
-export default async function grabPageBundledReactComponent({ file_path, root_file, server_res, }) {
+export default async function grabPageBundledReactComponent({ file_path, root_file_path, server_res, }) {
     try {
         let tsx = grabPageReactComponentString({
             file_path,
-            root_file,
+            root_file_path,
             server_res,
         });
         if (!tsx) {

dist/functions/server/web-pages/grab-page-component.js

@@ -3,7 +3,7 @@ import grabPageErrorComponent from "./grab-page-error-component";
 import grabPageBundledReactComponent from "./grab-page-bundled-react-component";
 import _ from "lodash";
 import { log } from "../../../utils/log";
-import grabRootFile from "./grab-root-file";
+import grabRootFilePath from "./grab-root-file-path";
 class NotFoundError extends Error {
 }
 export default async function grabPageComponent({ req, file_path: passed_file_path, debug, }) {
@@ -33,7 +33,7 @@ export default async function grabPageComponent({ req, file_path: passed_file_pa
             // log.error(errMsg);
             throw new Error(errMsg);
         }
-        const bundledMap = global.BUNDLER_CTX_MAP?.find((m) => m.local_path == file_path);
+        const bundledMap = global.BUNDLER_CTX_MAP[file_path];
         if (!bundledMap?.path) {
             const errMsg = `No Bundled File Path for this request path!`;
             log.error(errMsg);
@@ -42,7 +42,7 @@ export default async function grabPageComponent({ req, file_path: passed_file_pa
         if (debug) {
             log.info(`bundledMap:`, bundledMap);
         }
-        const { root_file } = grabRootFile();
+        const { root_file_path } = grabRootFilePath();
         const module = await import(`${file_path}?t=${now}`);
         if (debug) {
             log.info(`module:`, module);
@@ -107,7 +107,7 @@ export default async function grabPageComponent({ req, file_path: passed_file_pa
         const Head = module.Head;
         const { component } = (await grabPageBundledReactComponent({
             file_path,
-            root_file,
+            root_file_path,
             server_res: serverRes,
         })) || {};
         if (!component) {

dist/functions/server/web-pages/grab-page-error-component.js

@@ -11,7 +11,7 @@ export default async function grabPageErrorComponent({ error, routeParams, is404
         const match = router.match(errorRoute);
         const filePath = match?.filePath || presetComponent;
         const bundledMap = match?.filePath
-            ? (global.BUNDLER_CTX_MAP?.find((m) => m.local_path === match.filePath) ?? {})
+            ? global.BUNDLER_CTX_MAP[match.filePath]
             : {};
         const module = await import(filePath);
         const Component = module.default;
@@ -23,9 +23,9 @@ export default async function grabPageErrorComponent({ error, routeParams, is404
             bundledMap,
             serverRes: {
                 responseOptions: {
-                    status: is404 ? 404 : 500
+                    status: is404 ? 404 : 500,
-                }
+                },
-            }
+            },
         };
     }
     catch {
@@ -44,9 +44,9 @@ export default async function grabPageErrorComponent({ error, routeParams, is404
             bundledMap: {},
             serverRes: {
                 responseOptions: {
-                    status: is404 ? 404 : 500
+                    status: is404 ? 404 : 500,
-                }
+                },
-            }
+            },
         };
     }
 }

dist/functions/server/web-pages/grab-page-react-component-string.d.ts

@@ -1,7 +1,7 @@
 type Params = {
     file_path: string;
-    root_file?: string;
+    root_file_path?: string;
     server_res?: any;
 };
-export default function grabPageReactComponentString({ file_path, root_file, server_res, }: Params): string | undefined;
+export default function grabPageReactComponentString({ file_path, root_file_path, server_res, }: Params): string | undefined;
 export {};

dist/functions/server/web-pages/grab-page-react-component-string.js

@@ -1,18 +1,18 @@
 import EJSON from "../../../utils/ejson";
 import pagePathTransform from "../../../utils/page-path-transform";
-export default function grabPageReactComponentString({ file_path, root_file, server_res, }) {
+export default function grabPageReactComponentString({ file_path, root_file_path, server_res, }) {
     try {
         const target_path = pagePathTransform({ page_path: file_path });
         let tsx = ``;
         const server_res_json = JSON.stringify(EJSON.stringify(server_res || {}) ?? "{}");
-        if (root_file) {
+        if (root_file_path) {
-            tsx += `import Root from "${root_file}"\n`;
+            tsx += `import Root from "${root_file_path}"\n`;
         }
         tsx += `import Page from "${target_path}"\n`;
         tsx += `export default function Main() {\n\n`;
         tsx += `const props = JSON.parse(${server_res_json})\n\n`;
         tsx += `    return (\n`;
-        if (root_file) {
+        if (root_file_path) {
             tsx += `        <Root suppressHydrationWarning={true} {...props}><Page {...props} /></Root>\n`;
         }
         else {

dist/functions/server/web-pages/grab-root-file-path.d.ts

@@ -0,0 +1,3 @@
+export default function grabRootFilePath(): {
+    root_file_path: string | undefined;
+};

dist/functions/server/web-pages/grab-root-file-path.js

@@ -2,13 +2,13 @@ import grabDirNames from "../../../utils/grab-dir-names";
 import path from "path";
 import AppNames from "../../../utils/grab-app-names";
 import { existsSync } from "fs";
-export default function grabRootFile() {
+export default function grabRootFilePath() {
     const { PAGES_DIR } = grabDirNames();
     const root_pages_component_ts_file = `${path.join(PAGES_DIR, AppNames["RootPagesComponentName"])}.ts`;
     const root_pages_component_tsx_file = `${path.join(PAGES_DIR, AppNames["RootPagesComponentName"])}.tsx`;
     const root_pages_component_js_file = `${path.join(PAGES_DIR, AppNames["RootPagesComponentName"])}.js`;
     const root_pages_component_jsx_file = `${path.join(PAGES_DIR, AppNames["RootPagesComponentName"])}.jsx`;
-    const root_file = existsSync(root_pages_component_tsx_file)
+    const root_file_path = existsSync(root_pages_component_tsx_file)
         ? root_pages_component_tsx_file
         : existsSync(root_pages_component_ts_file)
             ? root_pages_component_ts_file
@@ -17,5 +17,5 @@ export default function grabRootFile() {
                 : existsSync(root_pages_component_js_file)
                     ? root_pages_component_js_file
                     : undefined;
-    return { root_file };
+    return { root_file_path };
 }

dist/functions/server/web-pages/grab-root-file.d.ts

@@ -1,3 +0,0 @@
-export default function grabRootFile(): {
-    root_file: string | undefined;
-};

dist/functions/server/web-pages/grab-web-page-hydration-script.js

@@ -18,7 +18,9 @@ export default async function (params) {
     script += `    overlay.innerHTML = \`<div style="max-width:900px;margin:0 auto"><div style="font-size:18px;font-weight:bold;margin-bottom:12px;color:#ff4444">Runtime Error</div><div style="color:#fff;margin-bottom:16px">\${message}</div>\${source ? \`<div style="color:#888;margin-bottom:16px">\${source}</div>\` : ""}\${stack ? \`<pre style="background:#111;padding:16px;border-radius:6px;overflow:auto;color:#ffa07a;white-space:pre-wrap">\${stack}</pre>\` : ""}<button onclick="this.closest('#__bunext_error_overlay').remove()" style="margin-top:16px;padding:8px 16px;background:#333;color:#fff;border:none;border-radius:4px;cursor:pointer">Dismiss</button></div>\`;\n`;
     script += `    document.body.appendChild(overlay);\n`;
     script += `}\n\n`;
-    script += `window.addEventListener("error", (e) => __bunext_show_error(e.message, e.filename ? e.filename + ":" + e.lineno + ":" + e.colno : "", e.error?.stack ?? ""));\n`;
+    script += `window.addEventListener("error", (e) => {\n`;
+    script += `    __bunext_show_error(e.message, e.filename ? e.filename + ":" + e.lineno + ":" + e.colno : "", e.error?.stack ?? "");\n`;
+    script += `});\n`;
     script += `window.addEventListener("unhandledrejection", (e) => __bunext_show_error(String(e.reason?.message ?? e.reason), "", e.reason?.stack ?? ""));\n\n`;
     script += `const hmr = new EventSource("/__hmr");\n`;
     script += `window.BUNEXT_HMR = hmr;\n`;
@@ -57,6 +59,9 @@ export default async function (params) {
     script += `            newScript.id = "${AppData["BunextClientHydrationScriptID"]}";\n`;
     script += `            newScript.type = "module";\n`;
     script += `            newScript.src = newScriptPath;\n`;
+    // script += `            newScript.onerror  = (e) => {\n`;
+    // script += `               window.location.reload();\n`;
+    // script += `            }\n`;
     // script += `            console.log("newScript", newScript);\n`;
     script += `            document.head.appendChild(newScript);\n\n`;
     script += `        } catch (err) {\n`;

dist/types/index.d.ts

@@ -246,6 +246,7 @@ export type GrabPageReactBundledComponentRes = {
 };
 export type PageFiles = {
     local_path: string;
+    transformed_path: string;
     url_path: string;
     file_name: string;
 };

dist/utils/grab-all-pages.js

@@ -2,6 +2,7 @@ import { existsSync, readdirSync, statSync } from "fs";
 import grabDirNames from "./grab-dir-names";
 import path from "path";
 import AppNames from "./grab-app-names";
+import pagePathTransform from "./page-path-transform";
 export default function grabAllPages(params) {
     const { PAGES_DIR } = grabDirNames();
     const pages = grabPageDirRecursively({ page_dir: PAGES_DIR });
@@ -56,8 +57,10 @@ function grabPageFileObject({ file_path, }) {
     let file_name = url_path.split("/").pop();
     if (!file_name)
         return;
+    const transformed_path = pagePathTransform({ page_path: file_path });
     return {
         local_path: file_path,
+        transformed_path,
         url_path,
         file_name,
     };

dist/utils/rewrite-pages-module.d.ts

@@ -1,5 +1,5 @@
 type Params = {
-    page_url?: string | string[];
+    page_file_path?: string | string[];
 };
 export default function rewritePagesModule(params?: Params): Promise<void>;
 export {};

dist/utils/rewrite-pages-module.js

@@ -2,10 +2,12 @@ import grabAllPages from "./grab-all-pages";
 import pagePathTransform from "./page-path-transform";
 import stripServerSideLogic from "../functions/bundler/strip-server-side-logic";
 export default async function rewritePagesModule(params) {
-    const { page_url } = params || {};
+    const { page_file_path } = params || {};
     let target_pages;
-    if (page_url) {
+    if (page_file_path) {
-        target_pages = Array.isArray(page_url) ? page_url : [page_url];
+        target_pages = Array.isArray(page_file_path)
+            ? page_file_path
+            : [page_file_path];
     }
     else {
         const pages = grabAllPages({ exclude_api: true });

package.json

@@ -2,7 +2,7 @@
     "name": "@moduletrace/bunext",
     "module": "index.ts",
     "type": "module",
-    "version": "1.0.16",
+    "version": "1.0.17",
     "main": "dist/index.js",
     "types": "dist/index.d.ts",
     "exports": {
@@ -34,17 +34,14 @@
     },
     "devDependencies": {
         "@testing-library/dom": "^10.4.1",
-        "@testing-library/react": "^16.3.2",
         "@types/lodash": "^4.17.24",
         "@types/micromatch": "^4.0.10",
-        "happy-dom": "^20.8.4",
+        "happy-dom": "^20.8.4"
-        "react": "^19.2.4",
-        "react-dom": "^19.2.4"
     },
     "peerDependencies": {
         "typescript": "^5.0.0",
-        "react": "^19.0.0",
+        "react": "^18.0.0 || ^19.0.0",
-        "react-dom": "^19.0.0"
+        "react-dom": "^18.0.0 || ^19.0.0"
     },
     "publishConfig": {
         "registry": "https://npm.pkg.github.com"
@@ -63,6 +60,7 @@
         "lodash": "^4.17.23",
         "micromatch": "^4.0.8",
         "ora": "^9.0.0",
-        "postcss": "^8.5.8"
+        "postcss": "^8.5.8",
+        "tailwindcss": "^4.2.2"
     }
 }

postcss.config.mjs

@@ -0,0 +1,5 @@
+export default {
+    plugins: {
+        "@tailwindcss/postcss": {},
+    },
+};

src/commands/build/index.ts

@@ -3,6 +3,11 @@ import allPagesBundler from "../../functions/bundler/all-pages-bundler";
 import { log } from "../../utils/log";
 import init from "../../functions/init";
 import rewritePagesModule from "../../utils/rewrite-pages-module";
+import allPagesBunBundler from "../../functions/bundler/all-pages-bun-bundler";
+import { execSync } from "child_process";
+import grabDirNames from "../../utils/grab-dir-names";
+
+const { HYDRATION_DST_DIR, BUNX_CWD_PAGES_REWRITE_DIR } = grabDirNames();
 
 export default function () {
     return new Command("build")
@@ -11,14 +16,19 @@ export default function () {
             process.env.NODE_ENV = "production";
             process.env.BUILD = "true";
 
+            try {
+                execSync(`rm -rf ${HYDRATION_DST_DIR}`);
+                execSync(`rm -rf ${BUNX_CWD_PAGES_REWRITE_DIR}`);
+            } catch (error) {}
+
             await rewritePagesModule();
             await init();
 
             log.banner();
             log.build("Building Project ...");
 
-            allPagesBundler({
+            // await allPagesBunBundler();
-                exit_after_first_build: true,
+
-            });
+            allPagesBundler();
         });
 }

src/commands/dev/index.ts

@@ -3,6 +3,10 @@ import startServer from "../../functions/server/start-server";
 import { log } from "../../utils/log";
 import bunextInit from "../../functions/bunext-init";
 import rewritePagesModule from "../../utils/rewrite-pages-module";
+import { execSync } from "child_process";
+import grabDirNames from "../../utils/grab-dir-names";
+
+const { HYDRATION_DST_DIR, BUNX_CWD_PAGES_REWRITE_DIR } = grabDirNames();
 
 export default function () {
     return new Command("dev")
@@ -12,6 +16,11 @@ export default function () {
 
             log.info("Running development server ...");
 
+            try {
+                execSync(`rm -rf ${HYDRATION_DST_DIR}`);
+                execSync(`rm -rf ${BUNX_CWD_PAGES_REWRITE_DIR}`);
+            } catch (error) {}
+
             await rewritePagesModule();
             await bunextInit();
 

src/functions/bundler/all-pages-bun-bundler.ts

@@ -0,0 +1,60 @@
+import grabAllPages from "../../utils/grab-all-pages";
+import grabDirNames from "../../utils/grab-dir-names";
+import isDevelopment from "../../utils/is-development";
+import { log } from "../../utils/log";
+import tailwindcss from "bun-plugin-tailwind";
+
+const { HYDRATION_DST_DIR } = grabDirNames();
+
+type Params = {
+    target?: "bun" | "browser";
+};
+
+export default async function allPagesBunBundler(params?: Params) {
+    const { target = "browser" } = params || {};
+    const pages = grabAllPages({ exclude_api: true });
+    const dev = isDevelopment();
+
+    let buildStart = 0;
+    buildStart = performance.now();
+
+    const build = await Bun.build({
+        entrypoints: pages.map((p) => p.transformed_path),
+        outdir: HYDRATION_DST_DIR,
+        minify: true,
+        format: "esm",
+        define: {
+            "process.env.NODE_ENV": JSON.stringify(
+                dev ? "development" : "production",
+            ),
+        },
+        naming: {
+            entry: "[name]/[hash].[ext]",
+            chunk: "chunks/[name]-[hash].[ext]",
+        },
+        plugins: [
+            tailwindcss,
+            {
+                name: "post-build",
+                setup(build) {
+                    build.onEnd((result) => {
+                        console.log("result", result);
+                    });
+                },
+            },
+        ],
+        // plugins: [
+
+        // ],
+        splitting: true,
+        target,
+        external: ["bun"],
+    });
+
+    console.log("build", build);
+
+    if (build.success) {
+        const elapsed = (performance.now() - buildStart).toFixed(0);
+        log.success(`[Built] in ${elapsed}ms`);
+    }
+}

src/functions/bundler/all-pages-bundler.ts

@@ -1,36 +1,43 @@
-import { readFileSync, writeFileSync } from "fs";
 import * as esbuild from "esbuild";
 import grabAllPages from "../../utils/grab-all-pages";
 import grabDirNames from "../../utils/grab-dir-names";
 import isDevelopment from "../../utils/is-development";
-import type { BundlerCTXMap } from "../../types";
-import { execSync } from "child_process";
 import { log } from "../../utils/log";
 import tailwindEsbuildPlugin from "../server/web-pages/tailwind-esbuild-plugin";
 import grabClientHydrationScript from "./grab-client-hydration-script";
 import grabArtifactsFromBundledResults from "./grab-artifacts-from-bundled-result";
-import stripServerSideLogic from "./strip-server-side-logic";
+import { writeFileSync } from "fs";
 
-const { HYDRATION_DST_DIR, HYDRATION_DST_DIR_MAP_JSON_FILE, ROOT_DIR } =
+const { HYDRATION_DST_DIR, HYDRATION_DST_DIR_MAP_JSON_FILE } = grabDirNames();
-    grabDirNames();
 
 let build_starts = 0;
 const MAX_BUILD_STARTS = 10;
 
 type Params = {
-    watch?: boolean;
+    /**
-    exit_after_first_build?: boolean;
+     * Locations of the pages Files.
-    post_build_fn?: (params: { artifacts: BundlerCTXMap[] }) => Promise<void>;
+     */
+    page_file_paths?: string[];
 };
 
 export default async function allPagesBundler(params?: Params) {
+    const { page_file_paths } = params || {};
+
     const pages = grabAllPages({ exclude_api: true });
 
+    const target_pages = page_file_paths?.[0]
+        ? pages.filter((p) => page_file_paths.includes(p.local_path))
+        : pages;
+
+    if (!page_file_paths) {
+        global.PAGE_FILES = pages;
+    }
+
     const virtualEntries: Record<string, string> = {};
     const dev = isDevelopment();
 
-    for (const page of pages) {
+    for (const page of target_pages) {
-        const key = page.local_path;
+        const key = page.transformed_path;
 
         const txt = await grabClientHydrationScript({
             page_local_path: page.local_path,
@@ -54,26 +61,6 @@ export default async function allPagesBundler(params?: Params) {
                 loader: "tsx",
                 resolveDir: process.cwd(),
             }));
-
-            build.onLoad({ filter: /\.tsx$/ }, (args) => {
-                if (args.path.includes("node_modules")) return;
-
-                const source = readFileSync(args.path, "utf8");
-
-                if (!source.includes("server")) {
-                    return { contents: source, loader: "tsx" };
-                }
-
-                const strippedCode = stripServerSideLogic({
-                    txt_code: source,
-                    file_path: args.path,
-                });
-
-                return {
-                    contents: strippedCode,
-                    loader: "tsx",
-                };
-            });
         },
     };
 
@@ -89,6 +76,7 @@ export default async function allPagesBundler(params?: Params) {
                 if (build_starts == MAX_BUILD_STARTS) {
                     const error_msg = `Build Failed. Please check all your components and imports.`;
                     log.error(error_msg);
+                    process.exit(1);
                 }
             });
 
@@ -105,14 +93,17 @@ export default async function allPagesBundler(params?: Params) {
                 }
 
                 const artifacts = grabArtifactsFromBundledResults({
-                    pages,
+                    pages: target_pages,
                     result,
                 });
 
                 if (artifacts?.[0] && artifacts.length > 0) {
-                    global.BUNDLER_CTX_MAP = artifacts;
+                    for (let i = 0; i < artifacts.length; i++) {
-                    global.PAGE_FILES = pages;
+                        const artifact = artifacts[i];
-                    params?.post_build_fn?.({ artifacts });
+                        global.BUNDLER_CTX_MAP[artifact.local_path] = artifact;
+                    }
+
+                    // params?.post_build_fn?.({ artifacts });
 
                     writeFileSync(
                         HYDRATION_DST_DIR_MAP_JSON_FILE,
@@ -125,19 +116,15 @@ export default async function allPagesBundler(params?: Params) {
 
                 global.RECOMPILING = false;
 
-                if (params?.exit_after_first_build) {
-                    process.exit();
-                }
-
                 build_starts = 0;
             });
         },
     };
 
-    execSync(`rm -rf ${HYDRATION_DST_DIR}`);
+    const entryPoints = Object.keys(virtualEntries).map((k) => `virtual:${k}`);
 
-    const ctx = await esbuild.context({
+    await esbuild.build({
-        entryPoints: Object.keys(virtualEntries).map((k) => `virtual:${k}`),
+        entryPoints,
         outdir: HYDRATION_DST_DIR,
         bundle: true,
         minify: true,
@@ -154,13 +141,6 @@ export default async function allPagesBundler(params?: Params) {
         plugins: [tailwindEsbuildPlugin, virtualPlugin, artifactTracker],
         jsx: "automatic",
         splitting: true,
-        logLevel: "silent",
+        // logLevel: "silent",
     });
-
-    await ctx.rebuild();
-
-    if (params?.watch) {
-        global.BUNDLER_CTX = ctx;
-        // global.BUNDLER_CTX.watch();
-    }
 }

src/functions/bundler/grab-artifacts-from-bundled-result.ts

@@ -19,14 +19,15 @@ export default function grabArtifactsFromBundledResults({
         .filter(([, meta]) => meta.entryPoint)
         .map(([outputPath, meta]) => {
             const target_page = pages.find((p) => {
-                return meta.entryPoint === `virtual:${p.local_path}`;
+                return meta.entryPoint === `virtual:${p.transformed_path}`;
             });
 
             if (!target_page || !meta.entryPoint) {
                 return undefined;
             }
 
-            const { file_name, local_path, url_path } = target_page;
+            const { file_name, local_path, url_path, transformed_path } =
+                target_page;
 
             const cssPath = meta.cssBundle || undefined;
 
@@ -41,6 +42,7 @@ export default function grabArtifactsFromBundledResults({
                 file_name,
                 local_path,
                 url_path,
+                transformed_path,
             };
         });
 

src/functions/bunext-init.ts

@@ -7,16 +7,14 @@ import type {
 } from "../types";
 import type { FileSystemRouter, Server } from "bun";
 import grabDirNames from "../utils/grab-dir-names";
-import type { BuildContext } from "esbuild";
 import { readFileSync, type FSWatcher } from "fs";
 import init from "./init";
 import isDevelopment from "../utils/is-development";
 import allPagesBundler from "./bundler/all-pages-bundler";
-import serverPostBuildFn from "./server/server-post-build-fn";
 import watcher from "./server/watcher";
-import EJSON from "../utils/ejson";
 import { log } from "../utils/log";
 import cron from "./server/cron";
+import EJSON from "../utils/ejson";
 
 /**
  * # Declare Global Variables
@@ -30,9 +28,7 @@ declare global {
     var ROUTER: FileSystemRouter;
     var HMR_CONTROLLERS: GlobalHMRControllerObject[];
     var LAST_BUILD_TIME: number;
-    var BUNDLER_CTX: BuildContext | undefined;
+    var BUNDLER_CTX_MAP: { [k: string]: BundlerCTXMap };
-    var BUNDLER_CTX_MAP: BundlerCTXMap[] | undefined;
-    var IS_FIRST_BUNDLE_READY: boolean;
     var BUNDLER_REBUILDS: 0;
     var PAGES_SRC_WATCHER: FSWatcher | undefined;
     var CURRENT_VERSION: string | undefined;
@@ -40,19 +36,19 @@ declare global {
     var ROOT_FILE_UPDATED: boolean;
 }
 
+const { PAGES_DIR, HYDRATION_DST_DIR_MAP_JSON_FILE } = grabDirNames();
+
 export default async function bunextInit() {
     global.ORA_SPINNER = ora();
     global.ORA_SPINNER.clear();
     global.HMR_CONTROLLERS = [];
-    global.IS_FIRST_BUNDLE_READY = false;
+    global.BUNDLER_CTX_MAP = {};
     global.BUNDLER_REBUILDS = 0;
     global.PAGE_FILES = [];
 
     await init();
     log.banner();
 
-    const { PAGES_DIR, HYDRATION_DST_DIR_MAP_JSON_FILE } = grabDirNames();
-
     const router = new Bun.FileSystemRouter({
         style: "nextjs",
         dir: PAGES_DIR,
@@ -63,40 +59,17 @@ export default async function bunextInit() {
     const is_dev = isDevelopment();
 
     if (is_dev) {
-        await allPagesBundler({
+        await allPagesBundler();
-            watch: true,
-            post_build_fn: serverPostBuildFn,
-        });
         watcher();
     } else {
         const artifacts = EJSON.parse(
             readFileSync(HYDRATION_DST_DIR_MAP_JSON_FILE, "utf-8"),
-        ) as BundlerCTXMap[] | undefined;
+        ) as { [k: string]: BundlerCTXMap } | undefined;
         if (!artifacts?.[0]) {
             log.error("Please build first.");
             process.exit(1);
         }
         global.BUNDLER_CTX_MAP = artifacts;
-        global.IS_FIRST_BUNDLE_READY = true;
         cron();
     }
-
-    let bundle_ready_retries = 0;
-    const MAX_BUNDLE_READY_RETRIES = 10;
-
-    while (!global.IS_FIRST_BUNDLE_READY) {
-        if (bundle_ready_retries > MAX_BUNDLE_READY_RETRIES) {
-            log.error("Couldn't grab first bundle for dev environment");
-            process.exit(1);
-        }
-        bundle_ready_retries++;
-        await Bun.sleep(500);
-    }
-
-    /**
-     * First Rebuild to Avoid errors
-     */
-    if (is_dev && global.BUNDLER_CTX) {
-        await global.BUNDLER_CTX.rebuild();
-    }
 }

src/functions/server/handle-hmr.ts

@@ -1,9 +1,3 @@
-import type { Server } from "bun";
-import type { BunextServerRouteConfig, BunxRouteParams } from "../../types";
-import grabRouteParams from "../../utils/grab-route-params";
-import grabConstants from "../../utils/grab-constants";
-import grabRouter from "../../utils/grab-router";
-
 type Params = {
     req: Request;
 };
@@ -13,7 +7,7 @@ export default async function ({ req }: Params): Promise<Response> {
     const match = global.ROUTER.match(referer_url.pathname);
 
     const target_map = match?.filePath
-        ? global.BUNDLER_CTX_MAP?.find((m) => m.local_path == match.filePath)
+        ? global.BUNDLER_CTX_MAP[match.filePath]
         : undefined;
 
     let controller: ReadableStreamDefaultController<string>;

src/functions/server/rebuild-bundler.tsx

@@ -2,17 +2,22 @@ import allPagesBundler from "../bundler/all-pages-bundler";
 import serverPostBuildFn from "./server-post-build-fn";
 import { log } from "../../utils/log";
 
-export default async function rebuildBundler() {
+type Params = {
+    target_file_paths?: string[];
+};
+
+export default async function rebuildBundler(params?: Params) {
     try {
         global.ROUTER.reload();
 
-        await global.BUNDLER_CTX?.dispose();
+        // await global.BUNDLER_CTX?.dispose();
-        global.BUNDLER_CTX = undefined;
+        // global.BUNDLER_CTX = undefined;
 
         await allPagesBundler({
-            watch: true,
+            page_file_paths: params?.target_file_paths,
-            post_build_fn: serverPostBuildFn,
         });
+
+        await serverPostBuildFn();
     } catch (error: any) {
         log.error(error);
     }

src/functions/server/server-post-build-fn.ts

@@ -2,25 +2,24 @@ import _ from "lodash";
 import type { BundlerCTXMap, GlobalHMRControllerObject } from "../../types";
 import grabPageComponent from "./web-pages/grab-page-component";
 
-type Params = {
+export default async function serverPostBuildFn() {
-    artifacts: BundlerCTXMap[];
+    // if (!global.IS_FIRST_BUNDLE_READY) {
-};
+    //     global.IS_FIRST_BUNDLE_READY = true;
+    // }
 
-export default async function serverPostBuildFn({ artifacts }: Params) {
+    if (!global.HMR_CONTROLLERS?.[0] || !global.BUNDLER_CTX_MAP) {
-    if (!global.IS_FIRST_BUNDLE_READY) {
-        global.IS_FIRST_BUNDLE_READY = true;
-    }
-
-    if (!global.HMR_CONTROLLERS?.[0]) {
         return;
     }
 
     for (let i = 0; i < global.HMR_CONTROLLERS.length; i++) {
         const controller = global.HMR_CONTROLLERS[i];
 
-        const target_artifact = artifacts.find(
+        if (!controller.target_map?.local_path) {
-            (a) => controller.target_map?.local_path == a.local_path,
+            continue;
-        );
+        }
+
+        const target_artifact =
+            global.BUNDLER_CTX_MAP[controller.target_map.local_path];
 
         const mock_req = new Request(controller.page_url);
 

src/functions/server/watcher.ts

@@ -1,4 +1,4 @@
-import { watch, existsSync, statSync } from "fs";
+import { watch, existsSync } from "fs";
 import path from "path";
 import grabDirNames from "../../utils/grab-dir-names";
 import rebuildBundler from "./rebuild-bundler";
@@ -45,17 +45,10 @@ export default async function watcher() {
             const target_files_match = /\.(tsx?|jsx?|css)$/;
 
             if (event !== "rename") {
-                if (filename.match(target_files_match) && global.BUNDLER_CTX) {
+                if (filename.match(target_files_match)) {
                     if (global.RECOMPILING) return;
                     global.RECOMPILING = true;
-
+                    await fullRebuild();
-                    if (full_file_path.match(/\_\_root\.tsx?$/)) {
-                        // log.watch(`__root.tsx file updated. Reloading window.`);
-                        global.ROOT_FILE_UPDATED = true;
-                    }
-
-                    await rewritePagesModule({ page_url: full_file_path });
-                    await global.BUNDLER_CTX.rebuild();
                 }
                 return;
             }
@@ -85,15 +78,23 @@ export default async function watcher() {
     global.PAGES_SRC_WATCHER = pages_src_watcher;
 }
 
-async function fullRebuild({ msg }: { msg?: string }) {
+async function fullRebuild(params?: { msg?: string }) {
     try {
+        const { msg } = params || {};
+
         global.RECOMPILING = true;
 
+        const target_file_paths = global.HMR_CONTROLLERS.map(
+            (hmr) => hmr.target_map?.local_path,
+        ).filter((f) => typeof f == "string");
+
+        await rewritePagesModule({ page_file_path: target_file_paths });
+
         if (msg) {
             log.watch(msg);
         }
 
-        await rebuildBundler();
+        await rebuildBundler({ target_file_paths });
     } catch (error: any) {
         log.error(error);
     } finally {

src/functions/server/web-pages/grab-page-bundled-react-component.tsx

@@ -4,19 +4,19 @@ import grabTsxStringModule from "./grab-tsx-string-module";
 
 type Params = {
     file_path: string;
-    root_file?: string;
+    root_file_path?: string;
     server_res?: any;
 };
 
 export default async function grabPageBundledReactComponent({
     file_path,
-    root_file,
+    root_file_path,
     server_res,
 }: Params): Promise<GrabPageReactBundledComponentRes | undefined> {
     try {
         let tsx = grabPageReactComponentString({
             file_path,
-            root_file,
+            root_file_path,
             server_res,
         });
 

src/functions/server/web-pages/grab-page-component.tsx

@@ -10,7 +10,7 @@ import grabPageErrorComponent from "./grab-page-error-component";
 import grabPageBundledReactComponent from "./grab-page-bundled-react-component";
 import _ from "lodash";
 import { log } from "../../../utils/log";
-import grabRootFile from "./grab-root-file";
+import grabRootFilePath from "./grab-root-file-path";
 
 class NotFoundError extends Error {}
 
@@ -62,9 +62,7 @@ export default async function grabPageComponent({
             throw new Error(errMsg);
         }
 
-        const bundledMap = global.BUNDLER_CTX_MAP?.find(
+        const bundledMap = global.BUNDLER_CTX_MAP[file_path];
-            (m) => m.local_path == file_path,
-        );
 
         if (!bundledMap?.path) {
             const errMsg = `No Bundled File Path for this request path!`;
@@ -76,7 +74,7 @@ export default async function grabPageComponent({
             log.info(`bundledMap:`, bundledMap);
         }
 
-        const { root_file } = grabRootFile();
+        const { root_file_path } = grabRootFilePath();
 
         const module: BunextPageModule = await import(`${file_path}?t=${now}`);
 
@@ -150,7 +148,7 @@ export default async function grabPageComponent({
         const { component } =
             (await grabPageBundledReactComponent({
                 file_path,
-                root_file,
+                root_file_path,
                 server_res: serverRes,
             })) || {};
 

src/functions/server/web-pages/grab-page-error-component.tsx

@@ -33,9 +33,7 @@ export default async function grabPageErrorComponent({
         const filePath = match?.filePath || presetComponent;
 
         const bundledMap = match?.filePath
-            ? (global.BUNDLER_CTX_MAP?.find(
+            ? global.BUNDLER_CTX_MAP[match.filePath]
-                  (m) => m.local_path === match.filePath,
-              ) ?? ({} as BundlerCTXMap))
             : ({} as BundlerCTXMap);
 
         const module: BunextPageModule = await import(filePath);
@@ -49,9 +47,9 @@ export default async function grabPageErrorComponent({
             bundledMap,
             serverRes: {
                 responseOptions: {
-                    status: is404 ? 404 : 500
+                    status: is404 ? 404 : 500,
-                }
+                },
-            } as any
+            } as any,
         };
     } catch {
         const DefaultNotFound: FC = () => (
@@ -77,9 +75,9 @@ export default async function grabPageErrorComponent({
             bundledMap: {} as BundlerCTXMap,
             serverRes: {
                 responseOptions: {
-                    status: is404 ? 404 : 500
+                    status: is404 ? 404 : 500,
-                }
+                },
-            } as any
+            } as any,
         };
     }
 }

src/functions/server/web-pages/grab-page-react-component-string.tsx

@@ -3,13 +3,13 @@ import pagePathTransform from "../../../utils/page-path-transform";
 
 type Params = {
     file_path: string;
-    root_file?: string;
+    root_file_path?: string;
     server_res?: any;
 };
 
 export default function grabPageReactComponentString({
     file_path,
-    root_file,
+    root_file_path,
     server_res,
 }: Params): string | undefined {
     try {
@@ -20,15 +20,15 @@ export default function grabPageReactComponentString({
             EJSON.stringify(server_res || {}) ?? "{}",
         );
 
-        if (root_file) {
+        if (root_file_path) {
-            tsx += `import Root from "${root_file}"\n`;
+            tsx += `import Root from "${root_file_path}"\n`;
         }
 
         tsx += `import Page from "${target_path}"\n`;
         tsx += `export default function Main() {\n\n`;
         tsx += `const props = JSON.parse(${server_res_json})\n\n`;
         tsx += `    return (\n`;
-        if (root_file) {
+        if (root_file_path) {
             tsx += `        <Root suppressHydrationWarning={true} {...props}><Page {...props} /></Root>\n`;
         } else {
             tsx += `        <Page suppressHydrationWarning={true} {...props} />\n`;

src/functions/server/web-pages/grab-root-file-path.tsx

@@ -3,7 +3,7 @@ import path from "path";
 import AppNames from "../../../utils/grab-app-names";
 import { existsSync } from "fs";
 
-export default function grabRootFile() {
+export default function grabRootFilePath() {
     const { PAGES_DIR } = grabDirNames();
 
     const root_pages_component_ts_file = `${path.join(PAGES_DIR, AppNames["RootPagesComponentName"])}.ts`;
@@ -11,7 +11,7 @@ export default function grabRootFile() {
     const root_pages_component_js_file = `${path.join(PAGES_DIR, AppNames["RootPagesComponentName"])}.js`;
     const root_pages_component_jsx_file = `${path.join(PAGES_DIR, AppNames["RootPagesComponentName"])}.jsx`;
 
-    const root_file = existsSync(root_pages_component_tsx_file)
+    const root_file_path = existsSync(root_pages_component_tsx_file)
         ? root_pages_component_tsx_file
         : existsSync(root_pages_component_ts_file)
           ? root_pages_component_ts_file
@@ -21,5 +21,5 @@ export default function grabRootFile() {
               ? root_pages_component_js_file
               : undefined;
 
-    return { root_file };
+    return { root_file_path };
 }

src/functions/server/web-pages/grab-web-page-hydration-script.tsx

@@ -12,6 +12,7 @@ export default async function (params?: Params) {
     let script = "";
 
     script += `console.log(\`Development Environment\`);\n\n`;
+
     script += `const _ce = console.error.bind(console);\n`;
     script += `console.error = (...args) => {\n`;
     script += `    if (typeof args[0] === "string" && args[0].includes("hydrat")) return;\n`;
@@ -27,7 +28,9 @@ export default async function (params?: Params) {
     script += `    overlay.innerHTML = \`<div style="max-width:900px;margin:0 auto"><div style="font-size:18px;font-weight:bold;margin-bottom:12px;color:#ff4444">Runtime Error</div><div style="color:#fff;margin-bottom:16px">\${message}</div>\${source ? \`<div style="color:#888;margin-bottom:16px">\${source}</div>\` : ""}\${stack ? \`<pre style="background:#111;padding:16px;border-radius:6px;overflow:auto;color:#ffa07a;white-space:pre-wrap">\${stack}</pre>\` : ""}<button onclick="this.closest('#__bunext_error_overlay').remove()" style="margin-top:16px;padding:8px 16px;background:#333;color:#fff;border:none;border-radius:4px;cursor:pointer">Dismiss</button></div>\`;\n`;
     script += `    document.body.appendChild(overlay);\n`;
     script += `}\n\n`;
-    script += `window.addEventListener("error", (e) => __bunext_show_error(e.message, e.filename ? e.filename + ":" + e.lineno + ":" + e.colno : "", e.error?.stack ?? ""));\n`;
+    script += `window.addEventListener("error", (e) => {\n`;
+    script += `    __bunext_show_error(e.message, e.filename ? e.filename + ":" + e.lineno + ":" + e.colno : "", e.error?.stack ?? "");\n`;
+    script += `});\n`;
     script += `window.addEventListener("unhandledrejection", (e) => __bunext_show_error(String(e.reason?.message ?? e.reason), "", e.reason?.stack ?? ""));\n\n`;
 
     script += `const hmr = new EventSource("/__hmr");\n`;
@@ -73,6 +76,9 @@ export default async function (params?: Params) {
     script += `            newScript.id = "${AppData["BunextClientHydrationScriptID"]}";\n`;
     script += `            newScript.type = "module";\n`;
     script += `            newScript.src = newScriptPath;\n`;
+    // script += `            newScript.onerror  = (e) => {\n`;
+    // script += `               window.location.reload();\n`;
+    // script += `            }\n`;
     // script += `            console.log("newScript", newScript);\n`;
     script += `            document.head.appendChild(newScript);\n\n`;
     script += `        } catch (err) {\n`;

src/types/index.ts

@@ -266,6 +266,7 @@ export type GrabPageReactBundledComponentRes = {
 
 export type PageFiles = {
     local_path: string;
+    transformed_path: string;
     url_path: string;
     file_name: string;
 };

src/utils/grab-all-pages.ts

@@ -3,6 +3,7 @@ import grabDirNames from "./grab-dir-names";
 import path from "path";
 import type { PageFiles } from "../types";
 import AppNames from "./grab-app-names";
+import pagePathTransform from "./page-path-transform";
 
 type Params = {
     exclude_api?: boolean;
@@ -80,8 +81,11 @@ function grabPageFileObject({
     let file_name = url_path.split("/").pop();
     if (!file_name) return;
 
+    const transformed_path = pagePathTransform({ page_path: file_path });
+
     return {
         local_path: file_path,
+        transformed_path,
         url_path,
         file_name,
     };

src/utils/rewrite-pages-module.ts

@@ -3,15 +3,17 @@ import pagePathTransform from "./page-path-transform";
 import stripServerSideLogic from "../functions/bundler/strip-server-side-logic";
 
 type Params = {
-    page_url?: string | string[];
+    page_file_path?: string | string[];
 };
 
 export default async function rewritePagesModule(params?: Params) {
-    const { page_url } = params || {};
+    const { page_file_path } = params || {};
     let target_pages: string[] | undefined;
 
-    if (page_url) {
+    if (page_file_path) {
-        target_pages = Array.isArray(page_url) ? page_url : [page_url];
+        target_pages = Array.isArray(page_file_path)
+            ? page_file_path
+            : [page_file_path];
     } else {
         const pages = grabAllPages({ exclude_api: true });
         target_pages = pages.map((p) => p.local_path);