Moduletrace/bunext
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update Version

Browse Source
This commit is contained in:
Benjamin Toby 2026-03-21 06:38:20 +01:00
parent 7ef114ee70
commit 1611c845b9
6 changed files with 22 additions and 108 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
dist/functions/bundler/grab-client-hydration-script.js vendored
View File

@ -8,34 +8,12 @@ export default function grabClientHydrationScript({ page_local_path }) {
const { ClientRootElementIDName, ClientRootComponentWindowName } = grabConstants(); const { ClientRootElementIDName, ClientRootComponentWindowName } = grabConstants();
const root_component_path = path.join(PAGES_DIR, `${AppNames["RootPagesComponentName"]}.tsx`); const root_component_path = path.join(PAGES_DIR, `${AppNames["RootPagesComponentName"]}.tsx`);
const does_root_exist = existsSync(root_component_path); const does_root_exist = existsSync(root_component_path);
// let txt = ``;
// txt += `import { hydrateRoot } from "react-dom/client";\n`;
// if (does_root_exist) {
// txt += `import Root from "${root_component_path}";\n`;
// }
// txt += `import Page from "${page.local_path}";\n\n`;
// txt += `const pageProps = window.__PAGE_PROPS__ || {};\n`;
// if (does_root_exist) {
// txt += `const component = <Root {...pageProps}><Page {...pageProps} /></Root>\n`;
// } else {
// txt += `const component = <Page {...pageProps} />\n`;
// }
// txt += `const root = hydrateRoot(document.getElementById("${ClientRootElementIDName}"), component);\n\n`;
// txt += `window.${ClientRootComponentWindowName} = root;\n`;
let txt = ``; let txt = ``;
// txt += `import * as React from "react";\n`;
// txt += `import * as ReactDOM from "react-dom";\n`;
// txt += `import * as ReactDOMClient from "react-dom/client";\n`;
// txt += `import * as JSXRuntime from "react/jsx-runtime";\n`;
txt += `import { hydrateRoot, createElement } from "react-dom/client";\n`; txt += `import { hydrateRoot, createElement } from "react-dom/client";\n`;
if (does_root_exist) { if (does_root_exist) {
txt += `import Root from "${root_component_path}";\n`; txt += `import Root from "${root_component_path}";\n`;
} }
txt += `import Page from "${page_local_path}";\n\n`; txt += `import Page from "${page_local_path}";\n\n`;
// txt += `window.__REACT__ = React;\n`;
// txt += `window.__REACT_DOM__ = ReactDOM;\n`;
// txt += `window.__REACT_DOM_CLIENT__ = ReactDOMClient;\n`;
// txt += `window.__JSX_RUNTIME__ = JSXRuntime;\n\n`;
txt += `const pageProps = window.__PAGE_PROPS__ || {};\n`; txt += `const pageProps = window.__PAGE_PROPS__ || {};\n`;
if (does_root_exist) { if (does_root_exist) {
txt += `const component = <Root suppressHydrationWarning={true} {...pageProps}><Page {...pageProps} /></Root>\n`; txt += `const component = <Root suppressHydrationWarning={true} {...pageProps}><Page {...pageProps} /></Root>\n`;
@ -55,13 +33,5 @@ export default function grabClientHydrationScript({ page_local_path }) {
txt += ` root.render(<NewPage {...props} />);\n`; txt += ` root.render(<NewPage {...props} />);\n`;
txt += ` };\n`; txt += ` };\n`;
txt += `}\n`; txt += `}\n`;
// // HMR re-render helper
// if (does_root_exist) {
// txt += `window.__BUNEXT_RERENDER__ = (NewPage) => {\n`;
// txt += ` const props = window.__PAGE_PROPS__ || {};\n`;
// txt += ` root.render(<Root {...props}><NewPage {...props} /></Root>);\n`;
// txt += `};\n`;
// } else {
// }
return txt; return txt;
} }

1
dist/functions/server/bunext-req-handler.js vendored
View File

@ -1,4 +1,3 @@
import grabAppPort from "../../utils/grab-app-port";
import handleWebPages from "./web-pages/handle-web-pages"; import handleWebPages from "./web-pages/handle-web-pages";
import handleRoutes from "./handle-routes"; import handleRoutes from "./handle-routes";
import isDevelopment from "../../utils/is-development"; import isDevelopment from "../../utils/is-development";

2
dist/functions/server/web-pages/generate-web-html.js vendored
View File

@ -36,7 +36,7 @@ export default async function genWebHTML({ component, pageProps, bundledMap, hea
html += ` <script src="/${bundledMap.path}" type="module" id="${AppData["BunextClientHydrationScriptID"]}" async></script>\n`; html += ` <script src="/${bundledMap.path}" type="module" id="${AppData["BunextClientHydrationScriptID"]}" async></script>\n`;
} }
if (isDevelopment()) { if (isDevelopment()) {
html += `<script defer>\n${await grabWebPageHydrationScript({ bundledMap })}\n</script>\n`; html += `<script defer>\n${await grabWebPageHydrationScript()}\n</script>\n`;
} }
if (headHTML) { if (headHTML) {
html += ` ${headHTML}\n`; html += ` ${headHTML}\n`;

2
dist/functions/server/web-pages/grab-web-page-hydration-script.d.ts vendored
View File

@ -2,5 +2,5 @@ import type { BundlerCTXMap } from "../../../types";
type Params = { type Params = {
bundledMap?: BundlerCTXMap; bundledMap?: BundlerCTXMap;
}; };
export default function ({ bundledMap }: Params): Promise<string>; export default function (params?: Params): Promise<string>;
export {}; export {};

91
dist/functions/server/web-pages/grab-web-page-hydration-script.js vendored
View File

@ -1,27 +1,31 @@
import { AppData } from "../../../data/app-data"; import { AppData } from "../../../data/app-data";
export default async function ({ bundledMap }) { export default async function (params) {
let script = ""; let script = "";
script += `console.log(\`Development Environment\`);\n\n`; 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`;
script += ` _ce(...args);\n`;
script += `};\n\n`;
script += `function __bunext_show_error(message, source, stack) {\n`;
script += ` const existing = document.getElementById("__bunext_error_overlay");\n`;
script += ` if (existing) existing.remove();\n`;
script += ` const overlay = document.createElement("div");\n`;
script += ` overlay.id = "__bunext_error_overlay";\n`;
script += ` overlay.style.cssText = "position:fixed;inset:0;z-index:99999;background:#1a1a1a;color:#ff6b6b;font-family:monospace;font-size:14px;padding:24px;overflow:auto;";\n`;
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("unhandledrejection", (e) => __bunext_show_error(String(e.reason?.message ?? e.reason), "", e.reason?.stack ?? ""));\n\n`;
script += `const hmr = new EventSource("/__hmr");\n`; script += `const hmr = new EventSource("/__hmr");\n`;
script += `window.addEventListener("beforeunload", () => hmr.close());\n`; script += `window.addEventListener("beforeunload", () => hmr.close());\n`;
script += `hmr.addEventListener("update", async (event) => {\n`; script += `hmr.addEventListener("update", async (event) => {\n`;
script += ` if (event?.data) {\n`; script += ` if (event?.data) {\n`;
script += ` console.log(\`HMR Changes Detected. Updating ...\`);\n`; script += ` console.log(\`HMR Changes Detected. Updating ...\`);\n`;
script += ` try {\n`; script += ` try {\n`;
script += ` document.getElementById("__bunext_error_overlay")?.remove();\n`;
script += ` const data = JSON.parse(event.data);\n`; script += ` const data = JSON.parse(event.data);\n`;
// script += ` console.log("data", data);\n`;
// script += ` const modulePath = \`/\${data.target_map.path}\`;\n\n`;
// script += ` const modulePath = \`/${AppData["ClientHMRPath"]}?href=\${window.location.href}&t=\${Date.now()}\`;\n\n`;
// script += ` console.log("Fetching updated module ...", modulePath);\n\n`;
// script += ` const newModule = await import(modulePath);\n\n`;
// script += ` console.log("newModule", newModule);\n\n`;
// script += ` if (window.__BUNEXT_RERENDER__ && newModule.default) {\n`;
// script += ` window.__BUNEXT_RERENDER__(newModule.default);\n`;
// script += ` console.log(\`HMR: Component updated in-place\`);\n`;
// script += ` } else {\n`;
// script += ` console.warn(\`HMR: No re-render helper found, falling back to reload\`);\n`;
// // script += ` window.location.reload();\n`;
// script += ` }\n\n`;
script += ` if (data.target_map.css_path) {\n`; script += ` if (data.target_map.css_path) {\n`;
script += ` const oldLink = document.querySelector('link[rel="stylesheet"]');\n`; script += ` const oldLink = document.querySelector('link[rel="stylesheet"]');\n`;
script += ` const newLink = document.createElement("link");\n`; script += ` const newLink = document.createElement("link");\n`;
@ -49,62 +53,3 @@ export default async function ({ bundledMap }) {
script += `});\n`; script += `});\n`;
return script; return script;
} }
// import grabDirNames from "../../../utils/grab-dir-names";
// import type { BundlerCTXMap, PageDistGenParams } from "../../../types";
// const { BUNX_HYDRATION_SRC_DIR } = grabDirNames();
// type Params = {
// bundledMap?: BundlerCTXMap;
// };
// export default async function ({ bundledMap }: Params) {
// let script = "";
// // script += `import React from "react";\n`;
// // script += `import { hydrateRoot } from "react-dom/client";\n`;
// // script += `import App from "${page_file}";\n`;
// // script += `declare global {\n`;
// // script += ` interface Window {\n`;
// // script += ` ${ClientWindowPagePropsName}: any;\n`;
// // script += ` }\n`;
// // script += `}\n`;
// // script += `let root: any = null;\n\n`;
// // script += `const component = <App {...window.${ClientWindowPagePropsName}} />;\n\n`;
// // script += `const container = document.getElementById("${ClientRootElementIDName}");\n\n`;
// // script += `if (container) {\n`;
// // script += ` root = hydrateRoot(container, component);\n`;
// // script += `}\n\n`;
// script += `console.log(\`Development Environment\`);\n`;
// // script += `console.log(import.meta);\n`;
// // script += `if (import.meta.hot) {\n`;
// // script += ` console.log(\`HMR active\`);\n`;
// // script += ` import.meta.hot.dispose(() => {\n`;
// // script += ` console.log("dispose");\n`;
// // script += ` });\n`;
// // script += `}\n`;
// script += `const hmr = new EventSource("/__hmr");\n`;
// script += `hmr.addEventListener("update", async (event) => {\n`;
// // script += ` console.log(\`HMR even received:\`, event);\n`;
// script += ` if (event.data) {\n`;
// script += ` console.log(\`HMR Changes Detected. Reloading ...\`);\n`;
// // script += ` console.log("event", event);\n`;
// // script += ` console.log("window.${ClientRootComponentWindowName}", window.${ClientRootComponentWindowName});\n\n`;
// // script += ` const event_data = JSON.parse(event.data);\n\n`;
// // script += ` const new_js_path = \`/\${event_data.target_map.path}\`;\n\n`;
// // script += ` console.log("event_data", event_data);\n\n`;
// // script += ` console.log("new_js_path", new_js_path);\n\n`;
// // script += ` if (window.${ClientRootComponentWindowName}) {\n`;
// // script += ` const new_component = await import(new_js_path);\n`;
// // script += ` window.${ClientRootComponentWindowName}.render(new_component);\n`;
// // script += ` }\n`;
// // script += ` import("${page_file}?t=" + event.data.update).then((module) => {\n`;
// // script += ` root.render(module.default);\n`;
// // script += ` })\n`;
// // script += ` console.log("root", root);\n`;
// // script += ` root.unmount();\n`;
// // script += ` const container = document.getElementById("${ClientRootElementIDName}");\n\n`;
// // script += ` root = hydrateRoot(container!, component);\n`;
// // script += ` window.history.pushState({ page: 1 }, "New Page Title", \`\${window.location.pathname}?v=\${Date.now()}\`);\n`;
// // script += ` root.render(component);\n`;
// script += ` window.location.reload();\n`;
// script += ` }\n`;
// script += ` });\n`;
// return script;
// }

4
package.json
View File

@ -2,7 +2,7 @@
"name": "@moduletrace/bunext", "name": "@moduletrace/bunext",
"module": "index.ts", "module": "index.ts",
"type": "module", "type": "module",
"version": "1.0.5", "version": "1.0.6",
"main": "dist/index.js", "main": "dist/index.js",
"bin": { "bin": {
"bunext": "dist/commands/index.js" "bunext": "dist/commands/index.js"
@ -14,7 +14,7 @@
], ],
"scripts": { "scripts": {
"dev": "tsc --watch", "dev": "tsc --watch",
"publish": "tsc --noEmit && tsc && git add . && git commit -m 'Update Package.json.' && git push", "publish": "tsc --noEmit && tsc && git add . && git commit -m 'Update Version' && git push",
"compile": "bun build ./src/commands/index.ts --compile --outfile bin/bunext", "compile": "bun build ./src/commands/index.ts --compile --outfile bin/bunext",
"build": "tsc" "build": "tsc"
}, },