aboutsummaryrefslogtreecommitdiff
path: root/demos
diff options
context:
space:
mode:
Diffstat (limited to 'demos')
-rw-r--r--demos/hello-next/bun-framework-next/client.development.tsx5
-rw-r--r--demos/hello-next/bun-framework-next/package.json5
-rw-r--r--demos/hello-next/bun-framework-next/page-loader.ts91
-rw-r--r--demos/hello-next/bun-framework-next/renderDocument.tsx16
-rw-r--r--demos/hello-next/bun-framework-next/route-loader.ts63
-rw-r--r--demos/hello-next/next-env.d.ts6
-rw-r--r--demos/hello-next/pages/index.tsx2
-rw-r--r--demos/hello-next/pages/posts/[id].tsx1
-rw-r--r--demos/hello-next/pages/second.tsx2
9 files changed, 112 insertions, 79 deletions
diff --git a/demos/hello-next/bun-framework-next/client.development.tsx b/demos/hello-next/bun-framework-next/client.development.tsx
index 824171086..24c737b55 100644
--- a/demos/hello-next/bun-framework-next/client.development.tsx
+++ b/demos/hello-next/bun-framework-next/client.development.tsx
@@ -251,6 +251,8 @@ async function _boot(EntryPointNamespace) {
);
CachedApp = AppModule.default;
+ } else {
+ CachedApp = App;
}
}
@@ -281,6 +283,8 @@ async function _boot(EntryPointNamespace) {
isPreview,
});
+ globalThis.next.router = router;
+
ReactDOM.hydrate(
<TopLevelRender
App={CachedApp}
@@ -300,6 +304,7 @@ function TopLevelRender({ App, Component, props, scroll }) {
}
export function render(props) {
+
ReactDOM.render(
<TopLevelRender {...props} />,
document.querySelector("#__next")
diff --git a/demos/hello-next/bun-framework-next/package.json b/demos/hello-next/bun-framework-next/package.json
index 901391964..9f12a57a3 100644
--- a/demos/hello-next/bun-framework-next/package.json
+++ b/demos/hello-next/bun-framework-next/package.json
@@ -17,9 +17,11 @@
".tsx"
]
},
+ "css": "onimportcss",
"development": {
"client": "client.development.tsx",
"server": "server.development.tsx",
+ "css": "onimportcss",
"define": {
"client": {
".env": "NEXT_PUBLIC_",
@@ -61,7 +63,8 @@
},
"production": {
"client": "client.production.tsx",
- "server": "server.production.tsx"
+ "server": "server.production.tsx",
+ "css": "onimportcss"
}
},
"scripts": {
diff --git a/demos/hello-next/bun-framework-next/page-loader.ts b/demos/hello-next/bun-framework-next/page-loader.ts
index 84e623ab1..5674697d9 100644
--- a/demos/hello-next/bun-framework-next/page-loader.ts
+++ b/demos/hello-next/bun-framework-next/page-loader.ts
@@ -2,6 +2,23 @@ import NextPageLoader from "next/dist/client/page-loader";
import getAssetPathFromRoute from "next/dist/shared/lib/router/utils/get-asset-path-from-route";
import createRouteLoader from "./route-loader";
+function insertStyleSheet(url: string) {
+ if (document.querySelector(`link[href="${url}"]`)) {
+ return Promise.resolve();
+ }
+
+ return new Promise((resolve, reject) => {
+ const link = document.createElement("link");
+ link.rel = "stylesheet";
+ link.href = url;
+
+ link.onload = () => void resolve();
+
+ link.onerror = () => void reject();
+ document.head.appendChild(link);
+ });
+}
+
export default class PageLoader extends NextPageLoader {
public routeLoader: RouteLoader;
@@ -10,39 +27,81 @@ export default class PageLoader extends NextPageLoader {
// TODO: assetPrefix?
this.routeLoader = createRouteLoader("");
+
+ // Rewrite the pages object to omit the entry script
+ // At this point, the entry point has been loaded so we don't want to do that again.
+ for (let name in pages) {
+ for (let i = 0; i < pages[name].length; i += 1) {
+ const lastDot = pages[name][i].lastIndexOf(".");
+ if (lastDot == -1) continue;
+ if (
+ pages[name][i].substring(lastDot - ".entry".length, lastDot) !==
+ ".entry"
+ )
+ continue;
+
+ pages[name][i] =
+ pages[name][i].substring(0, lastDot - ".entry".length) +
+ pages[name][i].substring(lastDot);
+ }
+ }
+
this.pages = pages;
+ this.pageList = Object.keys(this.pages);
}
+ pageList: string[];
+ pages: Record<string, string[]>;
+
getPageList() {
- return Object.keys(this.pages);
+ return this.pageList;
}
+ cssQueue = [];
+
+ onImportCSS = (event) => {
+ this.cssQueue.push(insertStyleSheet(event.detail).then(() => void 0));
+ };
async loadPage(route: string): Promise<GoodPageCache> {
- try {
- const assets =
- globalThis.__NEXT_DATA__.pages[route] ||
- globalThis.__NEXT_DATA__.pages[getAssetPathFromRoute(route)];
-
- var src;
- console.log(getAssetPathFromRoute(route), assets);
- for (let asset of assets) {
- if (!asset.endsWith(".css")) {
- src = asset;
- break;
- }
+ const assets =
+ this.pages[route] || this.pages[getAssetPathFromRoute(route)];
+
+ var src;
+ console.log(getAssetPathFromRoute(route), assets);
+ for (let asset of assets) {
+ if (!asset.endsWith(".css")) {
+ src = asset;
+ break;
}
+ }
+ console.assert(src, "Invalid or unknown route passed to loadPage");
- console.assert(src, "Invalid or unknown route passed to loadPage");
+ document.removeEventListener("onimportcss", this.onImportCSS);
+ this.cssQueue.length = 0;
+ document.addEventListener("onimportcss", this.onImportCSS, {
+ passive: true,
+ });
+ try {
const res = await import(src);
- console.log({ res });
+ if (this.cssQueue.length > 0) {
+ await Promise.all(this.cssQueue);
+
+ this.cssQueue.length = 0;
+ }
+ document.removeEventListener("onimportcss", this.onImportCSS);
return {
page: res.default,
mod: res,
+ styleSheets: [],
__N_SSG: false,
__N_SSP: false,
};
- } catch (err) {}
+
+ debugger;
+ } catch (exception) {
+ debugger;
+ }
// return this.routeLoader.loadRoute(route).then((res) => {
// debugger;
diff --git a/demos/hello-next/bun-framework-next/renderDocument.tsx b/demos/hello-next/bun-framework-next/renderDocument.tsx
index a25e5d273..7daec0005 100644
--- a/demos/hello-next/bun-framework-next/renderDocument.tsx
+++ b/demos/hello-next/bun-framework-next/renderDocument.tsx
@@ -411,14 +411,14 @@ export async function render({
const isAutoExport = false;
if (isAutoExport || isFallback) {
- // remove query values except ones that will be set during export
- query = {
- ...(query.amp
- ? {
- amp: query.amp,
- }
- : {}),
- };
+ // // remove query values except ones that will be set during export
+ // query = {
+ // ...(query.amp
+ // ? {
+ // amp: query.amp,
+ // }
+ // : {}),
+ // };
asPath = `${asPath}${
// ensure trailing slash is present for non-dynamic auto-export pages
asPath.endsWith("/") && asPath !== "/" && !pageIsDynamic ? "/" : ""
diff --git a/demos/hello-next/bun-framework-next/route-loader.ts b/demos/hello-next/bun-framework-next/route-loader.ts
index 887a57544..04714a6fe 100644
--- a/demos/hello-next/bun-framework-next/route-loader.ts
+++ b/demos/hello-next/bun-framework-next/route-loader.ts
@@ -226,35 +226,6 @@ function resolvePromiseWithTimeout<T>(
});
}
-// TODO: stop exporting or cache the failure
-// It'd be best to stop exporting this. It's an implementation detail. We're
-// only exporting it for backwards compatibility with the `page-loader`.
-// Only cache this response as a last resort if we cannot eliminate all other
-// code branches that use the Build Manifest Callback and push them through
-// the Route Loader interface.
-export function getClientBuildManifest(): Promise<ClientBuildManifest> {
- console.log("hiiiiiiiiiiiii");
- if (self.__BUILD_MANIFEST) {
- return Promise.resolve(self.__BUILD_MANIFEST);
- }
-
- const onBuildManifest: Promise<ClientBuildManifest> =
- new Promise<ClientBuildManifest>((resolve) => {
- // Mandatory because this is not concurrent safe:
- const cb = self.__BUILD_MANIFEST_CB;
- self.__BUILD_MANIFEST_CB = () => {
- resolve(self.__BUILD_MANIFEST!);
- cb && cb();
- };
- });
-
- return resolvePromiseWithTimeout<ClientBuildManifest>(
- onBuildManifest,
- MS_MAX_IDLE_DELAY,
- markAssetError(new Error("Failed to load client build manifest"))
- );
-}
-
interface RouteFiles {
scripts: string[];
css: string[];
@@ -263,28 +234,14 @@ function getFilesForRoute(
assetPrefix: string,
route: string
): Promise<RouteFiles> {
- if (process.env.NODE_ENV === "development") {
- return Promise.resolve({
- scripts: [
- encodeURI(
- globalThis.__NEXT_DATA.pages[route].filter((k) => !k.endsWith(".css"))
- ),
- ],
- // Styles are handled by `style-loader` in development:
- css: [],
- });
- }
- return getClientBuildManifest().then((manifest) => {
- if (!(route in manifest)) {
- throw markAssetError(new Error(`Failed to lookup route: ${route}`));
- }
- const allFiles = manifest[route].map(
- (entry) => assetPrefix + "/_next/" + encodeURI(entry)
- );
- return {
- scripts: allFiles.filter((v) => v.endsWith(".js")),
- css: allFiles.filter((v) => v.endsWith(".css")),
- };
+ return Promise.resolve({
+ scripts: [
+ encodeURI(
+ globalThis.__NEXT_DATA.pages[route].filter((k) => !k.endsWith(".css"))
+ ),
+ ],
+ // Styles are handled by `style-loader` in development:
+ css: [],
});
}
@@ -297,6 +254,8 @@ export default function createRouteLoader(assetPrefix: string): RouteLoader {
new Map();
function maybeExecuteScript(src: string): Promise<unknown> {
+ debugger;
+
let prom: Promise<unknown> | undefined = loadedScripts.get(src);
if (prom) {
return prom;
@@ -360,7 +319,7 @@ export default function createRouteLoader(assetPrefix: string): RouteLoader {
devBuildResolve = resolve;
});
}
-
+ debugger;
return resolvePromiseWithTimeout(
getFilesForRoute(assetPrefix, route)
.then(({ scripts, css }) => {
diff --git a/demos/hello-next/next-env.d.ts b/demos/hello-next/next-env.d.ts
new file mode 100644
index 000000000..9bc3dd46b
--- /dev/null
+++ b/demos/hello-next/next-env.d.ts
@@ -0,0 +1,6 @@
+/// <reference types="next" />
+/// <reference types="next/types/global" />
+/// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/basic-features/typescript for more information.
diff --git a/demos/hello-next/pages/index.tsx b/demos/hello-next/pages/index.tsx
index 0c5c1086f..87ccfd2b3 100644
--- a/demos/hello-next/pages/index.tsx
+++ b/demos/hello-next/pages/index.tsx
@@ -20,7 +20,7 @@ export default function Home() {
<main className={styles.main}>
<h1 className={styles.title}>
- Welcome <a href="https://nextjs.org">Next.js!</a>
+ apos[ <a href="https://nextjs.org">Next.js!</a>
</h1>
<p className={styles.description}>
diff --git a/demos/hello-next/pages/posts/[id].tsx b/demos/hello-next/pages/posts/[id].tsx
index 26cb704f6..48413669c 100644
--- a/demos/hello-next/pages/posts/[id].tsx
+++ b/demos/hello-next/pages/posts/[id].tsx
@@ -3,6 +3,7 @@ import Link from "next/link";
export default function Post({}) {
const router = useRouter();
+
return (
<div style={{ padding: 16 }}>
<h1>Post: {router.query.id}</h1>
diff --git a/demos/hello-next/pages/second.tsx b/demos/hello-next/pages/second.tsx
index 8cb0daa89..0e7b5a5cf 100644
--- a/demos/hello-next/pages/second.tsx
+++ b/demos/hello-next/pages/second.tsx
@@ -13,7 +13,7 @@ export default function Second({}) {
</li>
<li>
<Link href="/foo/bar/third">
- <a>Third page</a>
+ <a>Third! page</a>
</Link>
</li>
</ul>
generated by cgit v1.2.3 (git 2.46.0) at 2025-10-07 10:26:40 +0000