diff --git a/examples/react/rsc/client/.gitignore b/examples/react/rsc/spa/.gitignore
similarity index 100%
rename from examples/react/rsc/client/.gitignore
rename to examples/react/rsc/spa/.gitignore
diff --git a/examples/react/rsc/client/app.js b/examples/react/rsc/spa/app.js
similarity index 79%
rename from examples/react/rsc/client/app.js
rename to examples/react/rsc/spa/app.js
index 6df0f735..42c20ad0 100644
--- a/examples/react/rsc/client/app.js
+++ b/examples/react/rsc/spa/app.js
@@ -1,5 +1,7 @@
import serverComponent from "@vinxi/react-server-dom-vite/plugin";
import reactRefresh from "@vitejs/plugin-react";
+import { readFileSync } from "fs";
+import { join } from "path";
import { createApp } from "vinxi";
import { virtual } from "vinxi/lib/plugins/virtual";
@@ -92,7 +94,7 @@ function serverComponents() {
/**
*
- * @returns {import('vite').Plugin}
+ * @returns {import('vinxi').PluginOption}
*/
function clientComponents() {
let isBuild;
@@ -103,14 +105,25 @@ function clientComponents() {
isBuild = env.command === "build";
// @ts-ignore
const router = config.router;
+ // @ts-ignore
+ const app = config.app;
if (isBuild) {
+ const rscRouter = app.getRouter("rsc");
+
const reactServerManifest = JSON.parse(
- readFileSync(".build/rsc/_rsc/react-server-manifest.json", "utf-8"),
+ readFileSync(
+ join(
+ rscRouter.build.outDir,
+ rscRouter.base,
+ "react-server-manifest.json",
+ ),
+ "utf-8",
+ ),
);
input = {
- entry: getEntries(router)[0],
+ entry: router.handler,
...Object.fromEntries(
reactServerManifest.client.map((key) => {
return [hash(key), key];
@@ -118,10 +131,27 @@ function clientComponents() {
),
};
+ console.log(input);
+
return {
ssr: {
external: ["react", "react-dom", "@vinxi/react-server-dom-vite"],
},
+ optimizeDeps: {
+ include: [
+ "@vinxi/react-server-dom-vite",
+ "react-server-dom-vite",
+ "react",
+ "react-dom",
+ ],
+ }, // optimizeDeps: {
+ // include: [
+ // "@vinxi/react-server-dom-vite/client.browser",
+ // "@vinxi/react-server-dom-vite/runtime",
+ // "react",
+ // "react-dom",
+ // ],
+ // },
build: {
rollupOptions: {
// preserve the export names of the server actions in chunks
@@ -154,14 +184,19 @@ function clientComponents() {
return {
optimizeDeps: {
include: [
- "@vinxi/react-server-dom-vite/client",
- "@vinxi/react-server-dom-vite/runtime",
+ "@vinxi/react-server-dom-vite",
+ "react-server-dom-vite",
"react",
"react-dom",
],
},
ssr: {
- external: ["react", "react-dom", "@vinxi/react-server-dom-vite"],
+ external: [
+ "react",
+ "react-dom",
+ "@vinxi/react-server-dom-vite",
+ "react-server-dom-vite",
+ ],
},
};
}
@@ -169,9 +204,9 @@ function clientComponents() {
configResolved(config) {
if (isBuild) {
- const reactServerManifest = JSON.parse(
- readFileSync(".build/rsc/_rsc/react-server-manifest.json", "utf-8"),
- );
+ // const reactServerManifest = JSON.parse(
+ // readFileSync(".build/rsc/_rsc/react-server-manifest.json", "utf-8"),
+ // );
config.build.rollupOptions.input = input;
}
},
@@ -192,7 +227,10 @@ function viteServer() {
},
},
virtual({
- "#vite-dev-server": () => `export default viteServers['${router.name}']`,
+ "#vite-dev-server": ({ env }) =>
+ env.command === "build"
+ ? `export default undefined`
+ : `export default viteServers['${router.name}']`,
}),
];
}
diff --git a/examples/react/rsc/client/app/Counter.tsx b/examples/react/rsc/spa/app/Counter.tsx
similarity index 100%
rename from examples/react/rsc/client/app/Counter.tsx
rename to examples/react/rsc/spa/app/Counter.tsx
diff --git a/examples/react/rsc/client/app/actions.tsx b/examples/react/rsc/spa/app/actions.tsx
similarity index 100%
rename from examples/react/rsc/client/app/actions.tsx
rename to examples/react/rsc/spa/app/actions.tsx
diff --git a/examples/react/rsc/client/app/app.tsx b/examples/react/rsc/spa/app/app.tsx
similarity index 100%
rename from examples/react/rsc/client/app/app.tsx
rename to examples/react/rsc/spa/app/app.tsx
diff --git a/examples/react/rsc/client/app/client.tsx b/examples/react/rsc/spa/app/client.tsx
similarity index 89%
rename from examples/react/rsc/client/app/client.tsx
rename to examples/react/rsc/spa/app/client.tsx
index 616a47ca..7ee7997a 100644
--- a/examples/react/rsc/client/app/client.tsx
+++ b/examples/react/rsc/spa/app/client.tsx
@@ -9,7 +9,7 @@ import { ServerComponent } from "./server-component";
globalThis.__vite__ = createModuleLoader({
loadModule: async (id) => {
return import(
- /* @vite-ignore */ import.meta.env.MANIFEST["client"].inputs[id].output
+ /* @vite-ignore */ import.meta.env.MANIFEST["client"].chunks[id].output
.path
);
},
diff --git a/examples/react/rsc/client/app/react-server.tsx b/examples/react/rsc/spa/app/react-server.tsx
similarity index 100%
rename from examples/react/rsc/client/app/react-server.tsx
rename to examples/react/rsc/spa/app/react-server.tsx
diff --git a/examples/react/rsc/client/app/server-component.tsx b/examples/react/rsc/spa/app/server-component.tsx
similarity index 100%
rename from examples/react/rsc/client/app/server-component.tsx
rename to examples/react/rsc/spa/app/server-component.tsx
diff --git a/examples/react/rsc/client/app/server.tsx b/examples/react/rsc/spa/app/server.tsx
similarity index 100%
rename from examples/react/rsc/client/app/server.tsx
rename to examples/react/rsc/spa/app/server.tsx
diff --git a/examples/react/rsc/client/app/style.css b/examples/react/rsc/spa/app/style.css
similarity index 100%
rename from examples/react/rsc/client/app/style.css
rename to examples/react/rsc/spa/app/style.css
diff --git a/examples/react/rsc/client/index.html b/examples/react/rsc/spa/index.html
similarity index 100%
rename from examples/react/rsc/client/index.html
rename to examples/react/rsc/spa/index.html
diff --git a/examples/react/rsc/react-rsc/package.json b/examples/react/rsc/spa/package.json
similarity index 100%
rename from examples/react/rsc/react-rsc/package.json
rename to examples/react/rsc/spa/package.json
diff --git a/examples/react/rsc/client/postcss.config.cjs b/examples/react/rsc/spa/postcss.config.cjs
similarity index 100%
rename from examples/react/rsc/client/postcss.config.cjs
rename to examples/react/rsc/spa/postcss.config.cjs
diff --git a/examples/react/rsc/client/public/favicon.ico b/examples/react/rsc/spa/public/favicon.ico
similarity index 100%
rename from examples/react/rsc/client/public/favicon.ico
rename to examples/react/rsc/spa/public/favicon.ico
diff --git a/examples/react/rsc/client/tailwind.config.cjs b/examples/react/rsc/spa/tailwind.config.cjs
similarity index 100%
rename from examples/react/rsc/client/tailwind.config.cjs
rename to examples/react/rsc/spa/tailwind.config.cjs
diff --git a/examples/react/rsc/client/tsconfig.json b/examples/react/rsc/spa/tsconfig.json
similarity index 100%
rename from examples/react/rsc/client/tsconfig.json
rename to examples/react/rsc/spa/tsconfig.json
diff --git a/examples/react/rsc/react-rsc/.gitignore b/examples/react/rsc/ssr/.gitignore
similarity index 100%
rename from examples/react/rsc/react-rsc/.gitignore
rename to examples/react/rsc/ssr/.gitignore
diff --git a/examples/react/rsc/react-rsc/app.js b/examples/react/rsc/ssr/app.js
similarity index 100%
rename from examples/react/rsc/react-rsc/app.js
rename to examples/react/rsc/ssr/app.js
diff --git a/examples/react/rsc/react-rsc/app/Counter.tsx b/examples/react/rsc/ssr/app/Counter.tsx
similarity index 100%
rename from examples/react/rsc/react-rsc/app/Counter.tsx
rename to examples/react/rsc/ssr/app/Counter.tsx
diff --git a/examples/react/rsc/react-rsc/app/actions.tsx b/examples/react/rsc/ssr/app/actions.tsx
similarity index 100%
rename from examples/react/rsc/react-rsc/app/actions.tsx
rename to examples/react/rsc/ssr/app/actions.tsx
diff --git a/examples/react/rsc/react-rsc/app/app.tsx b/examples/react/rsc/ssr/app/app.tsx
similarity index 100%
rename from examples/react/rsc/react-rsc/app/app.tsx
rename to examples/react/rsc/ssr/app/app.tsx
diff --git a/examples/react/rsc/react-rsc/app/client.tsx b/examples/react/rsc/ssr/app/client.tsx
similarity index 65%
rename from examples/react/rsc/react-rsc/app/client.tsx
rename to examples/react/rsc/ssr/app/client.tsx
index 091a8a70..60e12b56 100644
--- a/examples/react/rsc/react-rsc/app/client.tsx
+++ b/examples/react/rsc/ssr/app/client.tsx
@@ -7,16 +7,12 @@ import "vinxi/runtime/client";
import { ServerComponent } from "./server-component";
globalThis.__vite__ = createModuleLoader({
- loadModule: import.meta.env.DEV
- ? async (id) => {
- return import(
- /* @vite-ignore */ import.meta.env.MANIFEST["client"].inputs[id]
- .output.path
- );
- }
- : async (id) => {
- return import("/_build/" + id + ".js");
- },
+ loadModule: async (id) => {
+ return import(
+ /* @vite-ignore */ import.meta.env.MANIFEST["client"].chunks[id].output
+ .path
+ );
+ },
});
startTransition(() => {
diff --git a/examples/react/rsc/react-rsc/app/react-server.tsx b/examples/react/rsc/ssr/app/react-server.tsx
similarity index 100%
rename from examples/react/rsc/react-rsc/app/react-server.tsx
rename to examples/react/rsc/ssr/app/react-server.tsx
diff --git a/examples/react/rsc/react-rsc/app/server-component.tsx b/examples/react/rsc/ssr/app/server-component.tsx
similarity index 100%
rename from examples/react/rsc/react-rsc/app/server-component.tsx
rename to examples/react/rsc/ssr/app/server-component.tsx
diff --git a/examples/react/rsc/react-rsc/app/server.tsx b/examples/react/rsc/ssr/app/server.tsx
similarity index 100%
rename from examples/react/rsc/react-rsc/app/server.tsx
rename to examples/react/rsc/ssr/app/server.tsx
diff --git a/examples/react/rsc/react-rsc/app/style.css b/examples/react/rsc/ssr/app/style.css
similarity index 100%
rename from examples/react/rsc/react-rsc/app/style.css
rename to examples/react/rsc/ssr/app/style.css
diff --git a/examples/react/rsc/client/package.json b/examples/react/rsc/ssr/package.json
similarity index 92%
rename from examples/react/rsc/client/package.json
rename to examples/react/rsc/ssr/package.json
index b540c662..21aa3507 100644
--- a/examples/react/rsc/client/package.json
+++ b/examples/react/rsc/ssr/package.json
@@ -8,6 +8,7 @@
"dependencies": {
"@picocss/pico": "^1.5.7",
"@vinxi/react": "workspace:^",
+ "@vinxi/react-server-dom-vite": "^0.0.2",
"@vitejs/plugin-react": "^4.0.1",
"autoprefixer": "^10.4.14",
"react": "0.0.0-experimental-035a41c4e-20230704",
diff --git a/examples/react/rsc/react-rsc/postcss.config.cjs b/examples/react/rsc/ssr/postcss.config.cjs
similarity index 100%
rename from examples/react/rsc/react-rsc/postcss.config.cjs
rename to examples/react/rsc/ssr/postcss.config.cjs
diff --git a/examples/react/rsc/react-rsc/public/favicon.ico b/examples/react/rsc/ssr/public/favicon.ico
similarity index 100%
rename from examples/react/rsc/react-rsc/public/favicon.ico
rename to examples/react/rsc/ssr/public/favicon.ico
diff --git a/examples/react/rsc/react-rsc/tailwind.config.cjs b/examples/react/rsc/ssr/tailwind.config.cjs
similarity index 100%
rename from examples/react/rsc/react-rsc/tailwind.config.cjs
rename to examples/react/rsc/ssr/tailwind.config.cjs
diff --git a/examples/react/rsc/react-rsc/tsconfig.json b/examples/react/rsc/ssr/tsconfig.json
similarity index 100%
rename from examples/react/rsc/react-rsc/tsconfig.json
rename to examples/react/rsc/ssr/tsconfig.json
diff --git a/packages/vinxi/client.d.ts b/packages/vinxi/client.d.ts
index 4295bb2f..d5ee8662 100644
--- a/packages/vinxi/client.d.ts
+++ b/packages/vinxi/client.d.ts
@@ -1,12 +1,12 @@
///
declare interface Window {
- manifest: any;
+ MANIFEST: any;
}
interface ImportMetaEnv {
// more env variables...
- readonly manifest: any;
+ readonly MANIFEST: any;
}
interface ImportMeta {
diff --git a/packages/vinxi/lib/manifest/client-manifest.js b/packages/vinxi/lib/manifest/client-manifest.js
index 840b0846..6280c3d8 100644
--- a/packages/vinxi/lib/manifest/client-manifest.js
+++ b/packages/vinxi/lib/manifest/client-manifest.js
@@ -16,6 +16,22 @@ const manifest = new Proxy(
handler: import.meta.env.DEV
? join(import.meta.env.CWD, import.meta.env.ROUTER_HANDLER)
: import.meta.env.ROUTER_HANDLER,
+ chunks: new Proxy(
+ {},
+ {
+ get(target, chunk) {
+ invariant(typeof chunk === "string", "Chunk expected");
+ let outputPath = import.meta.env.DEV
+ ? join(import.meta.env.BASE_URL, "@fs", chunk)
+ : join(import.meta.env.BASE_URL, chunk + ".js");
+ return {
+ output: {
+ path: outputPath,
+ },
+ };
+ },
+ },
+ ),
inputs: new Proxy(
{},
{
diff --git a/packages/vinxi/lib/manifest/dev-server-manifest.js b/packages/vinxi/lib/manifest/dev-server-manifest.js
index bffe666a..ef58916d 100644
--- a/packages/vinxi/lib/manifest/dev-server-manifest.js
+++ b/packages/vinxi/lib/manifest/dev-server-manifest.js
@@ -26,6 +26,32 @@ export function createDevManifest(app) {
return {};
},
handler: router.handler,
+ chunks: new Proxy(
+ {},
+ {
+ get(target, chunk) {
+ invariant(typeof chunk === "string", "Chunk expected");
+ let absolutePath = isAbsolute(chunk)
+ ? chunk
+ : join(app.config.root, chunk);
+
+ let relativePath = relative(app.config.root, chunk);
+ if (router.build.target === "browser") {
+ return {
+ output: {
+ path: join(router.base, "@fs", absolutePath),
+ },
+ };
+ } else {
+ return {
+ output: {
+ path: absolutePath,
+ },
+ };
+ }
+ },
+ },
+ ),
inputs: new Proxy(
{},
{
diff --git a/packages/vinxi/server.d.ts b/packages/vinxi/server.d.ts
index 4295bb2f..d5ee8662 100644
--- a/packages/vinxi/server.d.ts
+++ b/packages/vinxi/server.d.ts
@@ -1,12 +1,12 @@
///
declare interface Window {
- manifest: any;
+ MANIFEST: any;
}
interface ImportMetaEnv {
// more env variables...
- readonly manifest: any;
+ readonly MANIFEST: any;
}
interface ImportMeta {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 65f6663a..a2ea2d20 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -38,6 +38,9 @@ importers:
'@vinxi/react':
specifier: workspace:^
version: link:../../../../packages/vinxi-react
+ '@vinxi/react-server-dom-vite':
+ specifier: ^0.0.2
+ version: 0.0.2(react-dom@0.0.0-experimental-035a41c4e-20230704)(react@0.0.0-experimental-035a41c4e-20230704)(vite@4.3.9)
'@vitejs/plugin-react':
specifier: ^4.0.1
version: 4.0.1(vite@4.3.9)