Try local react imports

.gitignore

@@ -181,3 +181,4 @@ __fixtures__
 /.data
 /.dump
 /.vscode
+/source.md

src/commands/build/index.ts

@@ -1,11 +1,8 @@
 import { Command } from "commander";
 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 grabDirNames from "../../utils/grab-dir-names";
 import { rmSync } from "fs";
-import allPagesBundler from "../../functions/bundler/all-pages-bundler";
 import allPagesESBuildContextBundler from "../../functions/bundler/all-pages-esbuild-context-bundler";
 
 const { HYDRATION_DST_DIR, BUNX_CWD_PAGES_REWRITE_DIR } = grabDirNames();

src/functions/bunext-init.ts

@@ -33,9 +33,11 @@ declare global {
     var ROOT_FILE_UPDATED: boolean;
     var SKIPPED_BROWSER_MODULES: Set<string>;
     var BUNDLER_CTX: BuildContext | undefined;
+    var DIR_NAMES: ReturnType<typeof grabDirNames>;
 }
 
-const { PAGES_DIR } = grabDirNames();
+const dirNames = grabDirNames();
+const { PAGES_DIR } = dirNames;
 
 export default async function bunextInit() {
     global.HMR_CONTROLLERS = [];
@@ -43,6 +45,7 @@ export default async function bunextInit() {
     global.BUNDLER_REBUILDS = 0;
     global.PAGE_FILES = [];
     global.SKIPPED_BROWSER_MODULES = new Set<string>();
+    global.DIR_NAMES = dirNames;
 
     await init();
     log.banner();

src/functions/server/bunext-req-handler.ts

@@ -48,7 +48,7 @@ export default async function bunextRequestHandler({
 
         if (url.pathname === "/__hmr" && is_dev) {
             response = await handleHmr({ req });
-        } else if (url.pathname.startsWith("/.bunext/public/pages")) {
+        } else if (url.pathname.startsWith("/.bunext")) {
             response = await handleBunextPublicAssets({ req });
         } else if (url.pathname.startsWith("/api/")) {
             response = await handleRoutes({ req });

src/functions/server/handle-bunext-public-assets.ts

@@ -2,6 +2,7 @@ import grabDirNames from "../../utils/grab-dir-names";
 import path from "path";
 import isDevelopment from "../../utils/is-development";
 import { existsSync } from "fs";
+import { readFileResponse } from "./handle-public";
 
 const { HYDRATION_DST_DIR } = grabDirNames();
 
@@ -13,6 +14,45 @@ export default async function ({ req }: Params): Promise<Response> {
     try {
         const is_dev = isDevelopment();
         const url = new URL(req.url);
+
+        // switch (url.pathname) {
+        //     case "/.bunext/react":
+        //         return readFileResponse({
+        //             file_path: is_dev
+        //                 ? global.DIR_NAMES.REACT_DEVELOPMENT_MODULE
+        //                 : global.DIR_NAMES.REACT_PRODUCTION_MODULE,
+        //         });
+        //     case "/.bunext/react-dom":
+        //         return readFileResponse({
+        //             file_path: is_dev
+        //                 ? global.DIR_NAMES.REACT_DOM_DEVELOPMENT_MODULE
+        //                 : global.DIR_NAMES.REACT_DOM_PRODUCTION_MODULE,
+        //         });
+        //     case "/.bunext/react-dom-client":
+        //         return readFileResponse({
+        //             file_path: is_dev
+        //                 ? global.DIR_NAMES.REACT_DOM_CLIENT_DEVELOPMENT_MODULE
+        //                 : global.DIR_NAMES.REACT_DOM_CLIENT_PRODUCTION_MODULE,
+        //         });
+        //     case "/.bunext/react-jsx-runtime":
+        //         return readFileResponse({
+        //             file_path: is_dev
+        //                 ? global.DIR_NAMES.REACT_JSX_RUNTIME_DEVELOPMENT_MODULE
+        //                 : global.DIR_NAMES.REACT_JSX_RUNTIME_PRODUCTION_MODULE,
+        //         });
+        //     case "/.bunext/react-jsx-dev-runtime":
+        //         return readFileResponse({
+        //             file_path: is_dev
+        //                 ? global.DIR_NAMES
+        //                       .REACT_JSX_DEVELOPMENT_RUNTIME_DEVELOPMENT_MODULE
+        //                 : global.DIR_NAMES
+        //                       .REACT_JSX_DEVELOPMENT_RUNTIME_PRODUCTION_MODULE,
+        //         });
+
+        //     default:
+        //         break;
+        // }
+
         const file_path = path.join(
             HYDRATION_DST_DIR,
             url.pathname.replace(/\/\.bunext\/public\/pages\//, ""),
@@ -22,14 +62,7 @@ export default async function ({ req }: Params): Promise<Response> {
             return new Response("Forbidden", { status: 403 });
         }
 
-        if (!existsSync(file_path)) {
+        return readFileResponse({ file_path });
-            return new Response(`File Doesn't Exist`, {
-                status: 404,
-            });
-        }
-
-        const file = Bun.file(file_path);
-        return new Response(file);
     } catch (error) {
         return new Response(`File Not Found`, {
             status: 404,

src/functions/server/handle-public.ts

@@ -23,6 +23,15 @@ export default async function ({ req }: Params): Promise<Response> {
             return new Response("Forbidden", { status: 403 });
         }
 
+        return readFileResponse({ file_path });
+    } catch (error) {
+        return new Response(`Public File Not Found`, {
+            status: 404,
+        });
+    }
+}
+
+export function readFileResponse({ file_path }: { file_path: string }) {
     if (!existsSync(file_path)) {
         return new Response(`Public File Doesn't Exist`, {
             status: 404,
@@ -31,12 +40,7 @@ export default async function ({ req }: Params): Promise<Response> {
 
     const file = Bun.file(file_path);
 
-        let res_opts: ResponseInit = {};
+    // let res_opts: ResponseInit = {};
 
-        return new Response(file, res_opts);
+    return new Response(file);
-    } catch (error) {
-        return new Response(`Public File Not Found`, {
-            status: 404,
-        });
-    }
 }

src/functions/server/web-pages/generate-web-html.tsx

@@ -1,4 +1,4 @@
-import { renderToString } from "react-dom/server";
+import { renderToReadableStream, renderToString } from "react-dom/server";
 import grabContants from "../../../utils/grab-constants";
 import EJSON from "../../../utils/ejson";
 import type { LivePageDistGenParams } from "../../../types";
@@ -10,6 +10,9 @@ import { AppData } from "../../../data/app-data";
 import { readFileSync } from "fs";
 import path from "path";
 import _ from "lodash";
+import grabDirNames from "../../../utils/grab-dir-names";
+
+const {} = grabDirNames();
 
 let _reactVersion = "19";
 try {
@@ -70,6 +73,15 @@ export default async function genWebHTML({
 
     const dev = isDevelopment();
     const devSuffix = dev ? "?dev" : "";
+
+    // const browser_imports: Record<string, string> = {
+    //     react: `/.bunext/react`,
+    //     "react-dom": `/.bunext/react-dom`,
+    //     "react-dom/client": `/.bunext/react-dom-client`,
+    //     "react/jsx-runtime": `/.bunext/react-jsx-runtime`,
+    //     "react/jsx-dev-runtime": `/.bunext/react-jsx-dev-runtime`,
+    // };
+
     const browser_imports: Record<string, string> = {
         react: `https://esm.sh/react@${_reactVersion}`,
         "react-dom": `https://esm.sh/react-dom@${_reactVersion}`,
@@ -110,15 +122,10 @@ export default async function genWebHTML({
                     }}
                 />
 
-                {/* {global.SKIPPED_BROWSER_MODULES ? (
+                {RootHead ? (
-                    <script
+                    <RootHead serverRes={pageProps} ctx={routeParams} />
-                        type="importmap"
+                ) : null}
-                        dangerouslySetInnerHTML={{
+                {Head ? <Head serverRes={pageProps} ctx={routeParams} /> : null}
-                            __html: importMap,
-                        }}
-                        fetchPriority="high"
-                    />
-                ) : null} */}
 
                 {bundledMap?.path ? (
                     <>
@@ -146,11 +153,6 @@ export default async function genWebHTML({
                         }}
                     />
                 ) : null}
-
-                {RootHead ? (
-                    <RootHead serverRes={pageProps} ctx={routeParams} />
-                ) : null}
-                {Head ? <Head serverRes={pageProps} ctx={routeParams} /> : null}
             </head>
             <body>
                 <div
@@ -165,21 +167,21 @@ export default async function genWebHTML({
 
     let html = `<!DOCTYPE html>\n`;
 
-    // const stream = await renderToReadableStream(final_component, {
+    const stream = await renderToReadableStream(final_component, {
-    //     onError(error: any) {
+        onError(error: any) {
-    //         // This is where you "omit" or handle the errors
+            // This is where you "omit" or handle the errors
-    //         // You can log it silently or ignore it
+            // You can log it silently or ignore it
-    //         if (error.message.includes('unique "key" prop')) return;
+            if (error.message.includes('unique "key" prop')) return;
-    //         console.error(error);
+            console.error(error);
-    //     },
+        },
-    // });
+    });
 
-    // // 2. Convert the Web Stream to a String (Bun-optimized)
+    // 2. Convert the Web Stream to a String (Bun-optimized)
-    // const htmlBody = await new Response(stream).text();
+    const htmlBody = await new Response(stream).text();
 
-    // html += htmlBody;
+    html += htmlBody;
 
-    html += renderToString(final_component);
+    // html += renderToString(final_component);
 
     return html;
 }

src/types/index.ts

@@ -196,7 +196,11 @@ export type BunextPageModuleMeta = {
     robots?: string;
     canonical?: string;
     themeColor?: string;
-    og?: {
+    og?: BunextPageModuleMetaOG;
+    twitter?: BunextPageModuleMetaTwitter;
+};
+
+export type BunextPageModuleMetaOG = {
     title?: string;
     description?: string;
     image?: string;
@@ -205,7 +209,8 @@ export type BunextPageModuleMeta = {
     siteName?: string;
     locale?: string;
 };
-    twitter?: {
+
+export type BunextPageModuleMetaTwitter = {
     card?: "summary" | "summary_large_image" | "app" | "player";
     title?: string;
     description?: string;
@@ -213,7 +218,6 @@ export type BunextPageModuleMeta = {
     site?: string;
     creator?: string;
 };
-};
 
 export type BunextPageServerFn<
     T extends { [k: string]: any } = { [k: string]: any },

src/utils/grab-dir-names.ts

@@ -45,6 +45,71 @@ export default function grabDirNames() {
         `${BUNX_ROOT_404_FILE_NAME}.tsx`,
     );
 
+    // const NODE_MODULES_DIR = path.resolve(
+    //     existsSync(path.join(BUNX_ROOT_DIR, "source.md"))
+    //         ? BUNX_ROOT_DIR
+    //         : ROOT_DIR,
+    //     "node_modules",
+    // );
+
+    // const REACT_MODULE_DIR = path.join(NODE_MODULES_DIR, "react");
+    // const REACT_DOM_MODULE_DIR = path.join(NODE_MODULES_DIR, "react-dom");
+
+    // const REACT_PRODUCTION_MODULE = path.join(
+    //     REACT_MODULE_DIR,
+    //     "cjs",
+    //     "react.production.js",
+    // );
+    // const REACT_DEVELOPMENT_MODULE = path.join(
+    //     REACT_MODULE_DIR,
+    //     "cjs",
+    //     "react.development.js",
+    // );
+
+    // const REACT_JSX_RUNTIME_PRODUCTION_MODULE = path.join(
+    //     REACT_MODULE_DIR,
+    //     "cjs",
+    //     "react-jsx-runtime.production.js",
+    // );
+    // const REACT_JSX_RUNTIME_DEVELOPMENT_MODULE = path.join(
+    //     REACT_MODULE_DIR,
+    //     "cjs",
+    //     "react-jsx-runtime.development.js",
+    // );
+
+    // const REACT_JSX_DEVELOPMENT_RUNTIME_PRODUCTION_MODULE = path.join(
+    //     REACT_MODULE_DIR,
+    //     "cjs",
+    //     "react-jsx-dev-runtime.production.js",
+    // );
+    // const REACT_JSX_DEVELOPMENT_RUNTIME_DEVELOPMENT_MODULE = path.join(
+    //     REACT_MODULE_DIR,
+    //     "cjs",
+    //     "react-jsx-dev-runtime.development.js",
+    // );
+
+    // const REACT_DOM_PRODUCTION_MODULE = path.join(
+    //     REACT_DOM_MODULE_DIR,
+    //     "cjs",
+    //     "react-dom.production.js",
+    // );
+    // const REACT_DOM_DEVELOPMENT_MODULE = path.join(
+    //     REACT_DOM_MODULE_DIR,
+    //     "cjs",
+    //     "react-dom.development.js",
+    // );
+
+    // const REACT_DOM_CLIENT_PRODUCTION_MODULE = path.join(
+    //     REACT_DOM_MODULE_DIR,
+    //     "cjs",
+    //     "react-dom-client.production.js",
+    // );
+    // const REACT_DOM_CLIENT_DEVELOPMENT_MODULE = path.join(
+    //     REACT_DOM_MODULE_DIR,
+    //     "cjs",
+    //     "react-dom-client.development.js",
+    // );
+
     return {
         ROOT_DIR,
         SRC_DIR,
@@ -68,5 +133,18 @@ export default function grabDirNames() {
         BUNX_CWD_MODULE_CACHE_DIR,
         BUNX_CWD_PAGES_REWRITE_DIR,
         HYDRATION_DST_DIR_MAP_JSON_FILE_NAME,
+        // NODE_MODULES_DIR,
+        // REACT_MODULE_DIR,
+        // REACT_DOM_MODULE_DIR,
+        // REACT_PRODUCTION_MODULE,
+        // REACT_DEVELOPMENT_MODULE,
+        // REACT_JSX_RUNTIME_PRODUCTION_MODULE,
+        // REACT_JSX_RUNTIME_DEVELOPMENT_MODULE,
+        // REACT_JSX_DEVELOPMENT_RUNTIME_PRODUCTION_MODULE,
+        // REACT_JSX_DEVELOPMENT_RUNTIME_DEVELOPMENT_MODULE,
+        // REACT_DOM_PRODUCTION_MODULE,
+        // REACT_DOM_DEVELOPMENT_MODULE,
+        // REACT_DOM_CLIENT_PRODUCTION_MODULE,
+        // REACT_DOM_CLIENT_DEVELOPMENT_MODULE,
     };
 }