Component Bundler Bugfix
This commit is contained in:
parent
1037bbb546
commit
5166ba037f
@ -12,7 +12,7 @@ export default async function grabPageBundledReactComponent({ file_path, root_fi
|
||||
if (!tsx) {
|
||||
return undefined;
|
||||
}
|
||||
const mod = await grabTsxStringModule({ tsx, file_path });
|
||||
const mod = await grabTsxStringModule({ tsx });
|
||||
const Main = mod.default;
|
||||
const component = _jsx(Main, {});
|
||||
return {
|
||||
|
||||
@ -1,12 +1,11 @@
|
||||
import EJSON from "../../../utils/ejson";
|
||||
import isDevelopment from "../../../utils/is-development";
|
||||
import { log } from "../../../utils/log";
|
||||
import pagePathTransform from "../../../utils/page-path-transform";
|
||||
export default function grabPageReactComponentString({ file_path, root_file_path, server_res, }) {
|
||||
const now = Date.now();
|
||||
const dev = isDevelopment();
|
||||
try {
|
||||
// const target_path = pagePathTransform({ page_path: file_path });
|
||||
// const target_root_path = root_file_path
|
||||
// ? pagePathTransform({ page_path: root_file_path })
|
||||
// : undefined;
|
||||
const import_suffix = dev ? `?t=${now}` : "";
|
||||
let tsx = ``;
|
||||
const server_res_json = JSON.stringify(EJSON.stringify(server_res || {}) ?? "{}");
|
||||
// Import Root from its original source path so that all sub-components
|
||||
@ -15,9 +14,9 @@ export default function grabPageReactComponentString({ file_path, root_file_path
|
||||
// createContext() call, breaking context for any sub-component that
|
||||
// imports AppContext via a relative path to the source __root.
|
||||
if (root_file_path) {
|
||||
tsx += `import Root from "${root_file_path}"\n`;
|
||||
tsx += `import Root from "${root_file_path}${import_suffix}"\n`;
|
||||
}
|
||||
tsx += `import Page from "${file_path}"\n`;
|
||||
tsx += `import Page from "${file_path}${import_suffix}"\n`;
|
||||
tsx += `export default function Main() {\n\n`;
|
||||
tsx += `const props = JSON.parse(${server_res_json})\n\n`;
|
||||
tsx += ` return (\n`;
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
type Params = {
|
||||
tsx: string;
|
||||
file_path: string;
|
||||
};
|
||||
export default function grabTsxStringModule<T extends any = any>({ tsx, file_path, }: Params): Promise<T>;
|
||||
export default function grabTsxStringModule<T extends any = any>({ tsx, }: Params): Promise<T>;
|
||||
export {};
|
||||
|
||||
@ -1,38 +1,55 @@
|
||||
import isDevelopment from "../../../utils/is-development";
|
||||
import tailwindcss from "bun-plugin-tailwind";
|
||||
import grabDirNames from "../../../utils/grab-dir-names";
|
||||
import path from "path";
|
||||
import BunSkipNonBrowserPlugin from "../../bundler/plugins/bun-skip-browser-plugin";
|
||||
export default async function grabTsxStringModule({ tsx, file_path, }) {
|
||||
import { transform } from "esbuild";
|
||||
export default async function grabTsxStringModule({ tsx, }) {
|
||||
const dev = isDevelopment();
|
||||
const { BUNX_CWD_MODULE_CACHE_DIR } = grabDirNames();
|
||||
const trimmed_file_path = file_path
|
||||
.replace(/.*\/src\/pages\//, "")
|
||||
.replace(/\.tsx$/, "");
|
||||
const src_file_path = path.join(BUNX_CWD_MODULE_CACHE_DIR, `${trimmed_file_path}.tsx`);
|
||||
const out_file_path = path.join(BUNX_CWD_MODULE_CACHE_DIR, `${trimmed_file_path}.js`);
|
||||
await Bun.write(src_file_path, tsx);
|
||||
const build = await Bun.build({
|
||||
entrypoints: [src_file_path],
|
||||
const now = Date.now();
|
||||
const final_tsx = dev ? tsx + `\n// v_${now}` : tsx;
|
||||
const result = await transform(final_tsx, {
|
||||
loader: "tsx",
|
||||
format: "esm",
|
||||
target: "bun",
|
||||
external: ["react", "react-dom"],
|
||||
minify: true,
|
||||
define: {
|
||||
"process.env.NODE_ENV": JSON.stringify(dev ? "development" : "production"),
|
||||
},
|
||||
metafile: true,
|
||||
plugins: [tailwindcss, BunSkipNonBrowserPlugin],
|
||||
jsx: {
|
||||
runtime: "automatic",
|
||||
development: dev,
|
||||
},
|
||||
outdir: BUNX_CWD_MODULE_CACHE_DIR,
|
||||
jsx: "automatic",
|
||||
minify: !dev,
|
||||
});
|
||||
Loader.registry.delete(out_file_path);
|
||||
const module = await import(`${out_file_path}?t=${Date.now()}`);
|
||||
return module;
|
||||
const blob = new Blob([result.code], { type: "text/javascript" });
|
||||
const url = URL.createObjectURL(blob);
|
||||
const mod = await import(url);
|
||||
URL.revokeObjectURL(url);
|
||||
return mod;
|
||||
}
|
||||
// const trimmed_file_path = file_path
|
||||
// .replace(/.*\/src\/pages\//, "")
|
||||
// .replace(/\.tsx$/, "");
|
||||
// const src_file_path = path.join(
|
||||
// BUNX_CWD_MODULE_CACHE_DIR,
|
||||
// `${trimmed_file_path}.tsx`,
|
||||
// );
|
||||
// const out_file_path = path.join(
|
||||
// BUNX_CWD_MODULE_CACHE_DIR,
|
||||
// `${trimmed_file_path}.js`,
|
||||
// );
|
||||
// await Bun.write(src_file_path, tsx);
|
||||
// const build = await Bun.build({
|
||||
// entrypoints: [src_file_path],
|
||||
// format: "esm",
|
||||
// target: "bun",
|
||||
// // external: ["react", "react-dom"],
|
||||
// minify: true,
|
||||
// define: {
|
||||
// "process.env.NODE_ENV": JSON.stringify(
|
||||
// dev ? "development" : "production",
|
||||
// ),
|
||||
// },
|
||||
// metafile: true,
|
||||
// plugins: [tailwindcss, BunSkipNonBrowserPlugin],
|
||||
// jsx: {
|
||||
// runtime: "automatic",
|
||||
// development: dev,
|
||||
// },
|
||||
// outdir: BUNX_CWD_MODULE_CACHE_DIR,
|
||||
// });
|
||||
// Loader.registry.delete(out_file_path);
|
||||
// const module = await import(`${out_file_path}?t=${Date.now()}`);
|
||||
// return module as T;
|
||||
// await esbuild.build({
|
||||
// stdin: {
|
||||
// contents: tsx,
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
"name": "@moduletrace/bunext",
|
||||
"module": "index.ts",
|
||||
"type": "module",
|
||||
"version": "1.0.47",
|
||||
"version": "1.0.48",
|
||||
"main": "dist/index.js",
|
||||
"types": "dist/index.d.ts",
|
||||
"exports": {
|
||||
|
||||
@ -25,7 +25,7 @@ export default async function grabPageBundledReactComponent({
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const mod = await grabTsxStringModule({ tsx, file_path });
|
||||
const mod = await grabTsxStringModule({ tsx });
|
||||
const Main = mod.default;
|
||||
const component = <Main />;
|
||||
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import EJSON from "../../../utils/ejson";
|
||||
import isDevelopment from "../../../utils/is-development";
|
||||
import { log } from "../../../utils/log";
|
||||
import pagePathTransform from "../../../utils/page-path-transform";
|
||||
|
||||
type Params = {
|
||||
file_path: string;
|
||||
@ -13,11 +13,11 @@ export default function grabPageReactComponentString({
|
||||
root_file_path,
|
||||
server_res,
|
||||
}: Params): string | undefined {
|
||||
const now = Date.now();
|
||||
const dev = isDevelopment();
|
||||
|
||||
try {
|
||||
// const target_path = pagePathTransform({ page_path: file_path });
|
||||
// const target_root_path = root_file_path
|
||||
// ? pagePathTransform({ page_path: root_file_path })
|
||||
// : undefined;
|
||||
const import_suffix = dev ? `?t=${now}` : "";
|
||||
|
||||
let tsx = ``;
|
||||
|
||||
@ -31,10 +31,10 @@ export default function grabPageReactComponentString({
|
||||
// createContext() call, breaking context for any sub-component that
|
||||
// imports AppContext via a relative path to the source __root.
|
||||
if (root_file_path) {
|
||||
tsx += `import Root from "${root_file_path}"\n`;
|
||||
tsx += `import Root from "${root_file_path}${import_suffix}"\n`;
|
||||
}
|
||||
|
||||
tsx += `import Page from "${file_path}"\n`;
|
||||
tsx += `import Page from "${file_path}${import_suffix}"\n`;
|
||||
tsx += `export default function Main() {\n\n`;
|
||||
tsx += `const props = JSON.parse(${server_res_json})\n\n`;
|
||||
tsx += ` return (\n`;
|
||||
|
||||
@ -1,63 +1,75 @@
|
||||
import isDevelopment from "../../../utils/is-development";
|
||||
import tailwindcss from "bun-plugin-tailwind";
|
||||
import grabDirNames from "../../../utils/grab-dir-names";
|
||||
import path from "path";
|
||||
import BunSkipNonBrowserPlugin from "../../bundler/plugins/bun-skip-browser-plugin";
|
||||
import { transform } from "esbuild";
|
||||
|
||||
type Params = {
|
||||
tsx: string;
|
||||
file_path: string;
|
||||
};
|
||||
|
||||
export default async function grabTsxStringModule<T extends any = any>({
|
||||
tsx,
|
||||
file_path,
|
||||
}: Params): Promise<T> {
|
||||
const dev = isDevelopment();
|
||||
const { BUNX_CWD_MODULE_CACHE_DIR } = grabDirNames();
|
||||
const now = Date.now();
|
||||
|
||||
const trimmed_file_path = file_path
|
||||
.replace(/.*\/src\/pages\//, "")
|
||||
.replace(/\.tsx$/, "");
|
||||
const final_tsx = dev ? tsx + `\n// v_${now}` : tsx;
|
||||
|
||||
const src_file_path = path.join(
|
||||
BUNX_CWD_MODULE_CACHE_DIR,
|
||||
`${trimmed_file_path}.tsx`,
|
||||
);
|
||||
|
||||
const out_file_path = path.join(
|
||||
BUNX_CWD_MODULE_CACHE_DIR,
|
||||
`${trimmed_file_path}.js`,
|
||||
);
|
||||
|
||||
await Bun.write(src_file_path, tsx);
|
||||
|
||||
const build = await Bun.build({
|
||||
entrypoints: [src_file_path],
|
||||
const result = await transform(final_tsx, {
|
||||
loader: "tsx",
|
||||
format: "esm",
|
||||
target: "bun",
|
||||
external: ["react", "react-dom"],
|
||||
minify: true,
|
||||
define: {
|
||||
"process.env.NODE_ENV": JSON.stringify(
|
||||
dev ? "development" : "production",
|
||||
),
|
||||
},
|
||||
metafile: true,
|
||||
plugins: [tailwindcss, BunSkipNonBrowserPlugin],
|
||||
jsx: {
|
||||
runtime: "automatic",
|
||||
development: dev,
|
||||
},
|
||||
outdir: BUNX_CWD_MODULE_CACHE_DIR,
|
||||
jsx: "automatic",
|
||||
minify: !dev,
|
||||
});
|
||||
|
||||
Loader.registry.delete(out_file_path);
|
||||
const module = await import(`${out_file_path}?t=${Date.now()}`);
|
||||
const blob = new Blob([result.code], { type: "text/javascript" });
|
||||
const url = URL.createObjectURL(blob);
|
||||
const mod = await import(url);
|
||||
|
||||
return module as T;
|
||||
URL.revokeObjectURL(url);
|
||||
|
||||
return mod as T;
|
||||
}
|
||||
|
||||
// const trimmed_file_path = file_path
|
||||
// .replace(/.*\/src\/pages\//, "")
|
||||
// .replace(/\.tsx$/, "");
|
||||
|
||||
// const src_file_path = path.join(
|
||||
// BUNX_CWD_MODULE_CACHE_DIR,
|
||||
// `${trimmed_file_path}.tsx`,
|
||||
// );
|
||||
|
||||
// const out_file_path = path.join(
|
||||
// BUNX_CWD_MODULE_CACHE_DIR,
|
||||
// `${trimmed_file_path}.js`,
|
||||
// );
|
||||
|
||||
// await Bun.write(src_file_path, tsx);
|
||||
|
||||
// const build = await Bun.build({
|
||||
// entrypoints: [src_file_path],
|
||||
// format: "esm",
|
||||
// target: "bun",
|
||||
// // external: ["react", "react-dom"],
|
||||
// minify: true,
|
||||
// define: {
|
||||
// "process.env.NODE_ENV": JSON.stringify(
|
||||
// dev ? "development" : "production",
|
||||
// ),
|
||||
// },
|
||||
// metafile: true,
|
||||
// plugins: [tailwindcss, BunSkipNonBrowserPlugin],
|
||||
// jsx: {
|
||||
// runtime: "automatic",
|
||||
// development: dev,
|
||||
// },
|
||||
// outdir: BUNX_CWD_MODULE_CACHE_DIR,
|
||||
// });
|
||||
|
||||
// Loader.registry.delete(out_file_path);
|
||||
// const module = await import(`${out_file_path}?t=${Date.now()}`);
|
||||
|
||||
// return module as T;
|
||||
|
||||
// await esbuild.build({
|
||||
// stdin: {
|
||||
// contents: tsx,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user