diff --git a/bun.lock b/bun.lock index 512d189..72d8d47 100644 --- a/bun.lock +++ b/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=="], diff --git a/dist/commands/build/index.js b/dist/commands/build/index.js index 5f18717..2937524 100644 --- a/dist/commands/build/index.js +++ b/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({ - exit_after_first_build: true, - }); + // await allPagesBunBundler(); + allPagesBundler(); }); } diff --git a/dist/commands/dev/index.js b/dist/commands/dev/index.js index 7232638..658111c 100644 --- a/dist/commands/dev/index.js +++ b/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(); diff --git a/dist/functions/bundler/all-pages-bun-bundler.d.ts b/dist/functions/bundler/all-pages-bun-bundler.d.ts new file mode 100644 index 0000000..e4128f3 --- /dev/null +++ b/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; +export {}; diff --git a/dist/functions/bundler/all-pages-bun-bundler.js b/dist/functions/bundler/all-pages-bun-bundler.js new file mode 100644 index 0000000..f0e2857 --- /dev/null +++ b/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`); + } +} diff --git a/dist/functions/bundler/all-pages-bundler.d.ts b/dist/functions/bundler/all-pages-bundler.d.ts index 4a9a1a9..9b6b062 100644 --- a/dist/functions/bundler/all-pages-bundler.d.ts +++ b/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; - post_build_fn?: (params: { - artifacts: BundlerCTXMap[]; - }) => Promise; + /** + * Locations of the pages Files. + */ + page_file_paths?: string[]; }; export default function allPagesBundler(params?: Params): Promise; export {}; diff --git a/dist/functions/bundler/all-pages-bundler.js b/dist/functions/bundler/all-pages-bundler.js index 653171d..794ea0e 100644 --- a/dist/functions/bundler/all-pages-bundler.js +++ b/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"; -const { HYDRATION_DST_DIR, HYDRATION_DST_DIR_MAP_JSON_FILE, ROOT_DIR } = grabDirNames(); +import { writeFileSync } from "fs"; +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) { - const key = page.local_path; + for (const page of target_pages) { + 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; - global.PAGE_FILES = pages; - params?.post_build_fn?.({ artifacts }); + for (let i = 0; i < artifacts.length; i++) { + const artifact = artifacts[i]; + 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 ctx = await esbuild.context({ - entryPoints: Object.keys(virtualEntries).map((k) => `virtual:${k}`), + const entryPoints = Object.keys(virtualEntries).map((k) => `virtual:${k}`); + await esbuild.build({ + 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(); - } } diff --git a/dist/functions/bundler/grab-artifacts-from-bundled-result.js b/dist/functions/bundler/grab-artifacts-from-bundled-result.js index ae228a8..986d5fb 100644 --- a/dist/functions/bundler/grab-artifacts-from-bundled-result.js +++ b/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) { diff --git a/dist/functions/bunext-init.d.ts b/dist/functions/bunext-init.d.ts index 6f60f91..929c8da 100644 --- a/dist/functions/bunext-init.d.ts +++ b/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: BundlerCTXMap[] | undefined; - var IS_FIRST_BUNDLE_READY: boolean; + var BUNDLER_CTX_MAP: { + [k: string]: BundlerCTXMap; + }; var BUNDLER_REBUILDS: 0; var PAGES_SRC_WATCHER: FSWatcher | undefined; var CURRENT_VERSION: string | undefined; diff --git a/dist/functions/bunext-init.js b/dist/functions/bunext-init.js index 63fe6ff..828120b 100644 --- a/dist/functions/bunext-init.js +++ b/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({ - watch: true, - post_build_fn: serverPostBuildFn, - }); + await allPagesBundler(); 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(); - } } diff --git a/dist/functions/server/handle-hmr.js b/dist/functions/server/handle-hmr.js index 8c4177a..7dbd5eb 100644 --- a/dist/functions/server/handle-hmr.js +++ b/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; diff --git a/dist/functions/server/rebuild-bundler.d.ts b/dist/functions/server/rebuild-bundler.d.ts index a401ae9..3963a72 100644 --- a/dist/functions/server/rebuild-bundler.d.ts +++ b/dist/functions/server/rebuild-bundler.d.ts @@ -1 +1,5 @@ -export default function rebuildBundler(): Promise; +type Params = { + target_file_paths?: string[]; +}; +export default function rebuildBundler(params?: Params): Promise; +export {}; diff --git a/dist/functions/server/rebuild-bundler.js b/dist/functions/server/rebuild-bundler.js index 7dab958..bf309df 100644 --- a/dist/functions/server/rebuild-bundler.js +++ b/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(); - global.BUNDLER_CTX = undefined; + // await global.BUNDLER_CTX?.dispose(); + // global.BUNDLER_CTX = undefined; await allPagesBundler({ - watch: true, - post_build_fn: serverPostBuildFn, + page_file_paths: params?.target_file_paths, }); + await serverPostBuildFn(); } catch (error) { log.error(error); diff --git a/dist/functions/server/server-post-build-fn.d.ts b/dist/functions/server/server-post-build-fn.d.ts index 6437337..001b52c 100644 --- a/dist/functions/server/server-post-build-fn.d.ts +++ b/dist/functions/server/server-post-build-fn.d.ts @@ -1,6 +1 @@ -import type { BundlerCTXMap } from "../../types"; -type Params = { - artifacts: BundlerCTXMap[]; -}; -export default function serverPostBuildFn({ artifacts }: Params): Promise; -export {}; +export default function serverPostBuildFn(): Promise; diff --git a/dist/functions/server/server-post-build-fn.js b/dist/functions/server/server-post-build-fn.js index e02d4d4..12884e2 100644 --- a/dist/functions/server/server-post-build-fn.js +++ b/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 }) { - if (!global.IS_FIRST_BUNDLE_READY) { - global.IS_FIRST_BUNDLE_READY = true; - } - if (!global.HMR_CONTROLLERS?.[0]) { +export default async function serverPostBuildFn() { + // if (!global.IS_FIRST_BUNDLE_READY) { + // global.IS_FIRST_BUNDLE_READY = true; + // } + 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, diff --git a/dist/functions/server/watcher.js b/dist/functions/server/watcher.js index 27a02e5..77e86b8 100644 --- a/dist/functions/server/watcher.js +++ b/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?$/)) { - // 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(); + await fullRebuild(); } 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); diff --git a/dist/functions/server/web-pages/grab-page-bundled-react-component.d.ts b/dist/functions/server/web-pages/grab-page-bundled-react-component.d.ts index 403acbe..9b12d2c 100644 --- a/dist/functions/server/web-pages/grab-page-bundled-react-component.d.ts +++ b/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; +export default function grabPageBundledReactComponent({ file_path, root_file_path, server_res, }: Params): Promise; export {}; diff --git a/dist/functions/server/web-pages/grab-page-bundled-react-component.js b/dist/functions/server/web-pages/grab-page-bundled-react-component.js index 612373c..7aa6e1c 100644 --- a/dist/functions/server/web-pages/grab-page-bundled-react-component.js +++ b/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) { diff --git a/dist/functions/server/web-pages/grab-page-component.js b/dist/functions/server/web-pages/grab-page-component.js index 682e75e..ba3d5ea 100644 --- a/dist/functions/server/web-pages/grab-page-component.js +++ b/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) { diff --git a/dist/functions/server/web-pages/grab-page-error-component.js b/dist/functions/server/web-pages/grab-page-error-component.js index f0e2714..2881544 100644 --- a/dist/functions/server/web-pages/grab-page-error-component.js +++ b/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, + }, + }, }; } } diff --git a/dist/functions/server/web-pages/grab-page-react-component-string.d.ts b/dist/functions/server/web-pages/grab-page-react-component-string.d.ts index 8f5efe8..c39cff3 100644 --- a/dist/functions/server/web-pages/grab-page-react-component-string.d.ts +++ b/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 {}; diff --git a/dist/functions/server/web-pages/grab-page-react-component-string.js b/dist/functions/server/web-pages/grab-page-react-component-string.js index 874f239..ddae2cf 100644 --- a/dist/functions/server/web-pages/grab-page-react-component-string.js +++ b/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) { - tsx += `import Root from "${root_file}"\n`; + if (root_file_path) { + 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 += ` \n`; } else { diff --git a/dist/functions/server/web-pages/grab-root-file-path.d.ts b/dist/functions/server/web-pages/grab-root-file-path.d.ts new file mode 100644 index 0000000..4afd344 --- /dev/null +++ b/dist/functions/server/web-pages/grab-root-file-path.d.ts @@ -0,0 +1,3 @@ +export default function grabRootFilePath(): { + root_file_path: string | undefined; +}; diff --git a/dist/functions/server/web-pages/grab-root-file.js b/dist/functions/server/web-pages/grab-root-file-path.js similarity index 87% rename from dist/functions/server/web-pages/grab-root-file.js rename to dist/functions/server/web-pages/grab-root-file-path.js index f54c253..120ff9c 100644 --- a/dist/functions/server/web-pages/grab-root-file.js +++ b/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 }; } diff --git a/dist/functions/server/web-pages/grab-root-file.d.ts b/dist/functions/server/web-pages/grab-root-file.d.ts deleted file mode 100644 index 1c68fd8..0000000 --- a/dist/functions/server/web-pages/grab-root-file.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -export default function grabRootFile(): { - root_file: string | undefined; -}; diff --git a/dist/functions/server/web-pages/grab-web-page-hydration-script.js b/dist/functions/server/web-pages/grab-web-page-hydration-script.js index 2a5fd5f..4044b7d 100644 --- a/dist/functions/server/web-pages/grab-web-page-hydration-script.js +++ b/dist/functions/server/web-pages/grab-web-page-hydration-script.js @@ -18,7 +18,9 @@ export default async function (params) { script += ` overlay.innerHTML = \`
Runtime Error
\${message}
\${source ? \`
\${source}
\` : ""}\${stack ? \`
\${stack}
\` : ""}
\`;\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`; diff --git a/dist/types/index.d.ts b/dist/types/index.d.ts index fb2e93d..8a9b4ca 100644 --- a/dist/types/index.d.ts +++ b/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; }; diff --git a/dist/utils/grab-all-pages.js b/dist/utils/grab-all-pages.js index fb10ba1..2425de1 100644 --- a/dist/utils/grab-all-pages.js +++ b/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, }; diff --git a/dist/utils/rewrite-pages-module.d.ts b/dist/utils/rewrite-pages-module.d.ts index 4c76675..2987a1b 100644 --- a/dist/utils/rewrite-pages-module.d.ts +++ b/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; export {}; diff --git a/dist/utils/rewrite-pages-module.js b/dist/utils/rewrite-pages-module.js index 3d715fd..4d6346d 100644 --- a/dist/utils/rewrite-pages-module.js +++ b/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) { - target_pages = Array.isArray(page_url) ? page_url : [page_url]; + if (page_file_path) { + target_pages = Array.isArray(page_file_path) + ? page_file_path + : [page_file_path]; } else { const pages = grabAllPages({ exclude_api: true }); diff --git a/package.json b/package.json index b5ea122..32650f6 100644 --- a/package.json +++ b/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", - "react": "^19.2.4", - "react-dom": "^19.2.4" + "happy-dom": "^20.8.4" }, "peerDependencies": { "typescript": "^5.0.0", - "react": "^19.0.0", - "react-dom": "^19.0.0" + "react": "^18.0.0 || ^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" } } diff --git a/postcss.config.mjs b/postcss.config.mjs new file mode 100644 index 0000000..78253b6 --- /dev/null +++ b/postcss.config.mjs @@ -0,0 +1,5 @@ +export default { + plugins: { + "@tailwindcss/postcss": {}, + }, +}; diff --git a/src/commands/build/index.ts b/src/commands/build/index.ts index b1b5b50..e4cc262 100644 --- a/src/commands/build/index.ts +++ b/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({ - exit_after_first_build: true, - }); + // await allPagesBunBundler(); + + allPagesBundler(); }); } diff --git a/src/commands/dev/index.ts b/src/commands/dev/index.ts index 173da9e..ec98730 100644 --- a/src/commands/dev/index.ts +++ b/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(); diff --git a/src/functions/bundler/all-pages-bun-bundler.ts b/src/functions/bundler/all-pages-bun-bundler.ts new file mode 100644 index 0000000..a777909 --- /dev/null +++ b/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`); + } +} diff --git a/src/functions/bundler/all-pages-bundler.ts b/src/functions/bundler/all-pages-bundler.ts index 4bbc375..4389c4c 100644 --- a/src/functions/bundler/all-pages-bundler.ts +++ b/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 } = - grabDirNames(); +const { HYDRATION_DST_DIR, HYDRATION_DST_DIR_MAP_JSON_FILE } = grabDirNames(); let build_starts = 0; const MAX_BUILD_STARTS = 10; type Params = { - watch?: boolean; - exit_after_first_build?: boolean; - post_build_fn?: (params: { artifacts: BundlerCTXMap[] }) => Promise; + /** + * Locations of the pages Files. + */ + 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 = {}; const dev = isDevelopment(); - for (const page of pages) { - const key = page.local_path; + for (const page of target_pages) { + 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; - global.PAGE_FILES = pages; - params?.post_build_fn?.({ artifacts }); + for (let i = 0; i < artifacts.length; i++) { + const artifact = artifacts[i]; + 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({ - entryPoints: Object.keys(virtualEntries).map((k) => `virtual:${k}`), + await esbuild.build({ + 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(); - } } diff --git a/src/functions/bundler/grab-artifacts-from-bundled-result.ts b/src/functions/bundler/grab-artifacts-from-bundled-result.ts index 59face0..2e886fe 100644 --- a/src/functions/bundler/grab-artifacts-from-bundled-result.ts +++ b/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, }; }); diff --git a/src/functions/bunext-init.ts b/src/functions/bunext-init.ts index b34979d..4b2a206 100644 --- a/src/functions/bunext-init.ts +++ b/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: BundlerCTXMap[] | undefined; - var IS_FIRST_BUNDLE_READY: boolean; + var BUNDLER_CTX_MAP: { [k: string]: BundlerCTXMap }; 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({ - watch: true, - post_build_fn: serverPostBuildFn, - }); + await allPagesBundler(); 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(); - } } diff --git a/src/functions/server/handle-hmr.ts b/src/functions/server/handle-hmr.ts index 3b25244..ca7784e 100644 --- a/src/functions/server/handle-hmr.ts +++ b/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 { 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; diff --git a/src/functions/server/rebuild-bundler.tsx b/src/functions/server/rebuild-bundler.tsx index f58f6b9..bb5459e 100644 --- a/src/functions/server/rebuild-bundler.tsx +++ b/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(); - global.BUNDLER_CTX = undefined; + // await global.BUNDLER_CTX?.dispose(); + // global.BUNDLER_CTX = undefined; await allPagesBundler({ - watch: true, - post_build_fn: serverPostBuildFn, + page_file_paths: params?.target_file_paths, }); + + await serverPostBuildFn(); } catch (error: any) { log.error(error); } diff --git a/src/functions/server/server-post-build-fn.ts b/src/functions/server/server-post-build-fn.ts index 25e1c60..aee98e0 100644 --- a/src/functions/server/server-post-build-fn.ts +++ b/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 = { - artifacts: BundlerCTXMap[]; -}; +export default async function serverPostBuildFn() { + // if (!global.IS_FIRST_BUNDLE_READY) { + // global.IS_FIRST_BUNDLE_READY = true; + // } -export default async function serverPostBuildFn({ artifacts }: Params) { - if (!global.IS_FIRST_BUNDLE_READY) { - 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); diff --git a/src/functions/server/watcher.ts b/src/functions/server/watcher.ts index 49ec915..a453b6f 100644 --- a/src/functions/server/watcher.ts +++ b/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; - - 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(); + await fullRebuild(); } 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 { diff --git a/src/functions/server/web-pages/grab-page-bundled-react-component.tsx b/src/functions/server/web-pages/grab-page-bundled-react-component.tsx index 9ed79fe..1eae59f 100644 --- a/src/functions/server/web-pages/grab-page-bundled-react-component.tsx +++ b/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 { try { let tsx = grabPageReactComponentString({ file_path, - root_file, + root_file_path, server_res, }); diff --git a/src/functions/server/web-pages/grab-page-component.tsx b/src/functions/server/web-pages/grab-page-component.tsx index 5bae761..b1713c4 100644 --- a/src/functions/server/web-pages/grab-page-component.tsx +++ b/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( - (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!`; @@ -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, })) || {}; diff --git a/src/functions/server/web-pages/grab-page-error-component.tsx b/src/functions/server/web-pages/grab-page-error-component.tsx index fd441d2..1c1bcb7 100644 --- a/src/functions/server/web-pages/grab-page-error-component.tsx +++ b/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( - (m) => m.local_path === match.filePath, - ) ?? ({} as BundlerCTXMap)) + ? global.BUNDLER_CTX_MAP[match.filePath] : ({} as BundlerCTXMap); const module: BunextPageModule = await import(filePath); @@ -49,9 +47,9 @@ export default async function grabPageErrorComponent({ bundledMap, serverRes: { responseOptions: { - status: is404 ? 404 : 500 - } - } as any + status: is404 ? 404 : 500, + }, + } as any, }; } catch { const DefaultNotFound: FC = () => ( @@ -77,9 +75,9 @@ export default async function grabPageErrorComponent({ bundledMap: {} as BundlerCTXMap, serverRes: { responseOptions: { - status: is404 ? 404 : 500 - } - } as any + status: is404 ? 404 : 500, + }, + } as any, }; } } diff --git a/src/functions/server/web-pages/grab-page-react-component-string.tsx b/src/functions/server/web-pages/grab-page-react-component-string.tsx index be58587..cbe6302 100644 --- a/src/functions/server/web-pages/grab-page-react-component-string.tsx +++ b/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) { - tsx += `import Root from "${root_file}"\n`; + if (root_file_path) { + 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 += ` \n`; } else { tsx += ` \n`; diff --git a/src/functions/server/web-pages/grab-root-file.tsx b/src/functions/server/web-pages/grab-root-file-path.tsx similarity index 87% rename from src/functions/server/web-pages/grab-root-file.tsx rename to src/functions/server/web-pages/grab-root-file-path.tsx index c4cda36..a45dce4 100644 --- a/src/functions/server/web-pages/grab-root-file.tsx +++ b/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 }; } diff --git a/src/functions/server/web-pages/grab-web-page-hydration-script.tsx b/src/functions/server/web-pages/grab-web-page-hydration-script.tsx index 47fbf7a..72ae498 100644 --- a/src/functions/server/web-pages/grab-web-page-hydration-script.tsx +++ b/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 = \`
Runtime Error
\${message}
\${source ? \`
\${source}
\` : ""}\${stack ? \`
\${stack}
\` : ""}
\`;\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`; diff --git a/src/types/index.ts b/src/types/index.ts index 82b2668..4ede408 100644 --- a/src/types/index.ts +++ b/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; }; diff --git a/src/utils/grab-all-pages.ts b/src/utils/grab-all-pages.ts index 0e22abb..59cd31f 100644 --- a/src/utils/grab-all-pages.ts +++ b/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, }; diff --git a/src/utils/rewrite-pages-module.ts b/src/utils/rewrite-pages-module.ts index 15a2e1c..5b5e75e 100644 --- a/src/utils/rewrite-pages-module.ts +++ b/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) { - target_pages = Array.isArray(page_url) ? page_url : [page_url]; + if (page_file_path) { + 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);