waku 0.18.0 → 0.18.1

package/README.md

@@ -8,9 +8,12 @@
 
 <!-- [![size](https://img.shields.io/bundlephobia/minzip/waku)](https://bundlephobia.com/result?p=waku) -->
 
+Waku means "frame" in Japanese. Waku-Waku means being excited.
+https://github.com/dai-shi/waku/discussions/260
+
 ## Project status
 
-We are working toward v1-alpha: https://github.com/dai-shi/waku/issues/24
+Roadmap: See https://github.com/dai-shi/waku/issues/24 (working towards v1-alpha)
 
 Feel free to try it _seriously_ with non-production projects and give us feedback.
 
@@ -73,7 +76,7 @@ pnpm create waku
 These commands will create an example app that you can use as a
 starting point for your project.
 
-Minimum requirement: Node.js 18
+Minimum requirement: Node.js 18.3.0
 
 ## Practices
 
@@ -290,6 +293,34 @@ Alternatively, you could create a project with something like
 `npm create waku@latest` and copy files from the example
 folder in the repository.
 
+## Deploy
+
+### Vercel
+
+```sh
+vercel
+```
+
+Then change the setting as follows (needs redeploy for the first time):
+
+![vercel](https://github.com/dai-shi/waku/assets/490574/6bd317a8-2772-42f4-92d4-b508af7d7460)
+
+### Cloudflare (experimental)
+
+```sh
+npm run build -- --with-cloudflare
+rm -r node_modules
+npm install --omit=dev --omit=peer
+npx wrangler dev # or deploy
+```
+
+### Deno Deploy (experimental)
+
+```sh
+npm run build -- --with-deno
+DENO_DEPLOY_TOKEN=... deployctl deploy --project=... --prod serve.ts --exclude node_modules
+```
+
 ## Tweets
 
 <https://github.com/dai-shi/waku/discussions/150>

package/dist/cjs/cli.js

@@ -13,7 +13,7 @@ const _servestatic = require("@hono/node-server/serve-static");
 const _config = require("./lib/config.js");
 const _honodev = require("./lib/middleware/hono-dev.js");
 const _honoprd = require("./lib/middleware/hono-prd.js");
-const _builder = require("./lib/builder.js");
+const _build = require("./lib/builder/build.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -68,6 +68,15 @@ const { values, positionals } = (0, _nodeutil.parseArgs)({
         'with-ssr': {
             type: 'boolean'
         },
+        'with-vercel': {
+            type: 'boolean'
+        },
+        'with-cloudflare': {
+            type: 'boolean'
+        },
+        'with-deno': {
+            type: 'boolean'
+        },
         version: {
             type: 'boolean',
             short: 'v'
@@ -85,20 +94,24 @@ if (values.version) {
 } else if (values.help) {
     displayUsage();
 } else {
+    const withSsr = !!values['with-ssr'];
     switch(cmd){
         case 'dev':
             runDev({
-                ssr: !!values['with-ssr']
+                ssr: withSsr
             });
             break;
         case 'build':
             runBuild({
-                ssr: !!values['with-ssr']
+                ssr: withSsr,
+                vercel: values['with-vercel'],
+                cloudflare: !!values['with-cloudflare'],
+                deno: !!values['with-deno']
             });
             break;
         case 'start':
             runStart({
-                ssr: !!values['with-ssr']
+                ssr: withSsr
             });
             break;
         default:
@@ -111,16 +124,12 @@ if (values.version) {
 }
 async function runDev(options) {
     const app = new _hono.Hono();
-    app.use('*', (0, _honodev.honoMiddleware)({
-        ssr: options.ssr
-    }));
+    app.use('*', (0, _honodev.honoMiddleware)(options));
     const port = parseInt(process.env.PORT || '3000', 10);
     startServer(app, port);
 }
 async function runBuild(options) {
-    await (0, _builder.build)({
-        ssr: options.ssr
-    });
+    await (0, _build.build)(options);
 }
 async function runStart(options) {
     const { distDir, publicDir, entriesJs } = await (0, _config.resolveConfig)({});
@@ -128,7 +137,7 @@ async function runStart(options) {
     const app = new _hono.Hono();
     app.use('*', (0, _honoprd.honoMiddleware)({
         entries,
-        ssr: options.ssr
+        ...options
     }));
     app.use('*', (0, _servestatic.serveStatic)({
         root: _nodepath.default.join(distDir, publicDir)
@@ -148,7 +157,7 @@ async function startServer(app, port) {
             console.log(`warn: Port ${port} is in use, trying ${port + 1} instead.`);
             startServer(app, port + 1);
         } else {
-            console.error('Failed to start server');
+            console.error(`Failed to start server: ${err.message}`);
         }
     });
 }
@@ -162,8 +171,10 @@ Commands:
   start       Start the production server
 
 Options:
-  -c, --config <path>   Path to the configuration file
   --with-ssr            Use opt-in SSR
+  --with-vercel         Output for Vercel on build
+  --with-cloudflare     Output for Cloudflare on build
+  --with-deno           Output for Deno on build
   -v, --version         Display the version number
   -h, --help            Display this help message
 `);

package/dist/cjs/dev.js

@@ -10,7 +10,7 @@ function _export(target, all) {
 }
 _export(exports, {
     build: function() {
-        return _builder.build;
+        return _build.build;
     },
     connectMiddleware: function() {
         return _connectdev.connectMiddleware;
@@ -25,4 +25,4 @@ _export(exports, {
 const _honodev = require("./lib/middleware/hono-dev.js");
 const _connectdev = require("./lib/middleware/connect-dev.js");
 const _handlerdev = require("./lib/rsc/handler-dev.js");
-const _builder = require("./lib/builder.js");
+const _build = require("./lib/builder/build.js");

package/dist/cjs/lib/{builder.js → builder/build.js}

@@ -13,18 +13,21 @@ const _nodestream = require("node:stream");
 const _promises = require("node:stream/promises");
 const _vite = require("vite");
 const _pluginreact = /*#__PURE__*/ _interop_require_default(require("@vitejs/plugin-react"));
-const _config = require("./config.js");
-const _path = require("./utils/path.js");
-const _nodefs = require("./utils/node-fs.js");
-const _stream = require("./utils/stream.js");
-const _utils = require("./rsc/utils.js");
-const _rscrenderer = require("./rsc/rsc-renderer.js");
-const _htmlrenderer = require("./rsc/html-renderer.js");
-const _vitepluginrscindex = require("./plugins/vite-plugin-rsc-index.js");
-const _vitepluginrscanalyze = require("./plugins/vite-plugin-rsc-analyze.js");
-const _vitepluginnonjsresolve = require("./plugins/vite-plugin-nonjs-resolve.js");
-const _vitepluginrsctransform = require("./plugins/vite-plugin-rsc-transform.js");
-const _patchreactrefresh = require("./plugins/patch-react-refresh.js");
+const _config = require("../config.js");
+const _path = require("../utils/path.js");
+const _nodefs = require("../utils/node-fs.js");
+const _stream = require("../utils/stream.js");
+const _utils = require("../rsc/utils.js");
+const _rscrenderer = require("../rsc/rsc-renderer.js");
+const _htmlrenderer = require("../rsc/html-renderer.js");
+const _vitepluginrscindex = require("../plugins/vite-plugin-rsc-index.js");
+const _vitepluginrscanalyze = require("../plugins/vite-plugin-rsc-analyze.js");
+const _vitepluginnonjsresolve = require("../plugins/vite-plugin-nonjs-resolve.js");
+const _vitepluginrsctransform = require("../plugins/vite-plugin-rsc-transform.js");
+const _patchreactrefresh = require("../plugins/patch-react-refresh.js");
+const _outputvercel = require("./output-vercel.js");
+const _outputcloudflare = require("./output-cloudflare.js");
+const _outputdeno = require("./output-deno.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -368,7 +371,7 @@ export function loadHtml(pathStr) {
         const code = (0, _utils.generatePrefetchCode)(basePrefix, inputsForPrefetch, moduleIdsForPrefetch) + (customCode || '');
         if (code) {
             // HACK is this too naive to inject script code?
-            htmlStr = htmlStr.replace(/<\/head>/, `<script>${code}</script></head>`);
+            htmlStr = htmlStr.replace(/<\/head>/, `<script type="module" async>${code}</script></head>`);
         }
         const htmlResult = ssr && await (0, _htmlrenderer.renderHtml)({
             config,
@@ -402,93 +405,6 @@ export function loadHtml(pathStr) {
         htmlFiles
     };
 };
-const emitVercelOutput = async (rootDir, config, clientBuildOutput, rscFiles, htmlFiles, ssr)=>{
-    // FIXME somehow utils/(path,node-fs).ts doesn't work
-    const [path, { existsSync, mkdirSync, readdirSync, symlinkSync, writeFileSync }] = await Promise.all([
-        Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require("node:path"))),
-        Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require("node:fs")))
-    ]);
-    const clientFiles = clientBuildOutput.output.map(({ fileName })=>path.join(rootDir, config.distDir, config.publicDir, fileName));
-    const srcDir = path.join(rootDir, config.distDir, config.publicDir);
-    const dstDir = path.join(rootDir, config.distDir, '.vercel', 'output');
-    for (const file of [
-        ...clientFiles,
-        ...rscFiles,
-        ...htmlFiles
-    ]){
-        const dstFile = path.join(dstDir, 'static', path.relative(srcDir, file));
-        if (!existsSync(dstFile)) {
-            mkdirSync(path.dirname(dstFile), {
-                recursive: true
-            });
-            symlinkSync(path.relative(path.dirname(dstFile), file), dstFile);
-        }
-    }
-    // for serverless function
-    const serverlessDir = path.join(dstDir, 'functions', config.rscPath + '.func');
-    mkdirSync(path.join(serverlessDir, config.distDir), {
-        recursive: true
-    });
-    mkdirSync(path.join(serverlessDir, 'node_modules'));
-    symlinkSync(path.relative(path.join(serverlessDir, 'node_modules'), path.join(rootDir, 'node_modules', 'waku')), path.join(serverlessDir, 'node_modules', 'waku'));
-    for (const file of readdirSync(path.join(rootDir, config.distDir))){
-        if ([
-            '.vercel'
-        ].includes(file)) {
-            continue;
-        }
-        symlinkSync(path.relative(path.join(serverlessDir, config.distDir), path.join(rootDir, config.distDir, file)), path.join(serverlessDir, config.distDir, file));
-    }
-    const vcConfigJson = {
-        runtime: 'nodejs18.x',
-        handler: 'serve.js',
-        launcherType: 'Nodejs'
-    };
-    writeFileSync(path.join(serverlessDir, '.vc-config.json'), JSON.stringify(vcConfigJson, null, 2));
-    writeFileSync(path.join(serverlessDir, 'package.json'), JSON.stringify({
-        type: 'module'
-    }, null, 2));
-    writeFileSync(path.join(serverlessDir, 'serve.js'), `
-import path from 'node:path';
-import { connectMiddleware } from 'waku';
-const entries = import(path.resolve('${config.distDir}', '${config.entriesJs}'));
-export default async function handler(req, res) {
-  connectMiddleware({ entries, ssr: true })(req, res, () => {
-    throw new Error('not handled');
-  });
-}
-`);
-    const overrides = Object.fromEntries(rscFiles.filter((file)=>!path.extname(file)).map((file)=>[
-            path.relative(srcDir, file),
-            {
-                contentType: 'text/plain'
-            }
-        ]));
-    const basePrefix = config.basePath + config.rscPath + '/';
-    const routes = [
-        {
-            src: basePrefix + '(.*)',
-            dest: basePrefix
-        },
-        ...ssr ? htmlFiles.map((htmlFile)=>{
-            const file = config.basePath + path.relative(srcDir, htmlFile);
-            const src = file.endsWith('/' + config.indexHtml) ? file.slice(0, -('/' + config.indexHtml).length) || '/' : file;
-            return {
-                src,
-                dest: basePrefix
-            };
-        }) : []
-    ];
-    const configJson = {
-        version: 3,
-        overrides,
-        routes
-    };
-    mkdirSync(dstDir, {
-        recursive: true
-    });
-    writeFileSync(path.join(dstDir, 'config.json'), JSON.stringify(configJson, null, 2));
-};
 const resolveFileName = (fname)=>{
     for (const ext of [
         '.js',
@@ -510,9 +426,16 @@ async function build(options) {
     const distEntriesFile = resolveFileName((0, _path.joinPath)(rootDir, config.distDir, config.entriesJs));
     const { commonEntryFiles, clientEntryFiles, serverEntryFiles } = await analyzeEntries(entriesFile);
     const serverBuildOutput = await buildServerBundle(rootDir, config, entriesFile, distEntriesFile, commonEntryFiles, clientEntryFiles, serverEntryFiles);
-    const clientBuildOutput = await buildClientBundle(rootDir, config, commonEntryFiles, clientEntryFiles, serverBuildOutput);
+    await buildClientBundle(rootDir, config, commonEntryFiles, clientEntryFiles, serverBuildOutput);
     const { buildConfig, getClientModules, rscFiles } = await emitRscFiles(rootDir, config, distEntriesFile);
     const { htmlFiles } = await emitHtmlFiles(rootDir, config, distEntriesFile, buildConfig, getClientModules, !!options?.ssr);
-    // https://vercel.com/docs/build-output-api/v3
-    await emitVercelOutput(rootDir, config, clientBuildOutput, rscFiles, htmlFiles, !!options?.ssr);
+    if (options?.vercel ?? process.env.VERCEL) {
+        await (0, _outputvercel.emitVercelOutput)(rootDir, config, rscFiles, htmlFiles, !!options?.ssr);
+    }
+    if (options?.cloudflare) {
+        await (0, _outputcloudflare.emitCloudflareOutput)(rootDir, config, !!options?.ssr);
+    }
+    if (options?.deno) {
+        await (0, _outputdeno.emitDenoOutput)(rootDir, config, !!options?.ssr);
+    }
 }

package/dist/cjs/lib/builder/output-cloudflare.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "emitCloudflareOutput", {
+    enumerable: true,
+    get: function() {
+        return emitCloudflareOutput;
+    }
+});
+const _nodepath = /*#__PURE__*/ _interop_require_default(require("node:path"));
+const _nodefs = require("node:fs");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const emitCloudflareOutput = async (rootDir, config, ssr)=>{
+    const outputDir = _nodepath.default.resolve('.');
+    const relativeRootDir = _nodepath.default.relative(outputDir, rootDir);
+    const entriesFile = _nodepath.default.join(relativeRootDir, config.distDir, config.entriesJs);
+    const publicDir = _nodepath.default.join(relativeRootDir, config.distDir, config.publicDir);
+    if (!(0, _nodefs.existsSync)(_nodepath.default.join(outputDir, 'serve.js'))) {
+        (0, _nodefs.writeFileSync)(_nodepath.default.join(outputDir, 'serve.js'), `
+import { honoMiddleware } from 'waku';
+import { Hono } from 'hono';
+import { serveStatic } from 'hono/cloudflare-workers';
+
+const entries = import('./${entriesFile}');
+
+const app = new Hono();
+app.use('*', honoMiddleware({ entries, ssr: ${ssr} }));
+app.use('*', serveStatic({ root: './' }));
+export default app;
+`);
+    }
+    if (!(0, _nodefs.existsSync)(_nodepath.default.join(outputDir, 'wrangler.toml'))) {
+        (0, _nodefs.writeFileSync)(_nodepath.default.join(outputDir, 'wrangler.toml'), `
+name = "waku-project"
+main = "serve.js"
+compatibility_date = "2023-12-06"
+
+[site]
+bucket = "./${publicDir}"
+`);
+    }
+};

package/dist/cjs/lib/builder/output-deno.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "emitDenoOutput", {
+    enumerable: true,
+    get: function() {
+        return emitDenoOutput;
+    }
+});
+const _nodepath = /*#__PURE__*/ _interop_require_default(require("node:path"));
+const _nodefs = require("node:fs");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const emitDenoOutput = async (rootDir, config, ssr)=>{
+    const outputDir = _nodepath.default.resolve('.');
+    const relativeRootDir = _nodepath.default.relative(outputDir, rootDir);
+    const entriesFile = _nodepath.default.join(relativeRootDir, config.distDir, config.entriesJs);
+    const publicDir = _nodepath.default.join(relativeRootDir, config.distDir, config.publicDir);
+    if (!(0, _nodefs.existsSync)(_nodepath.default.join(outputDir, 'serve.ts'))) {
+        (0, _nodefs.writeFileSync)(_nodepath.default.join(outputDir, 'serve.ts'), `
+import { Hono } from "https://deno.land/x/hono/mod.ts";
+import { serveStatic } from "https://deno.land/x/hono/middleware.ts";
+import { honoMiddleware } from "npm:waku@0.18.1";
+
+const entries = import('./${entriesFile}');
+
+const app = new Hono();
+app.use('*', honoMiddleware({ entries, ssr: ${ssr} }));
+app.use("*", serveStatic({ root: "${publicDir}" }));
+
+Deno.serve(app.fetch);
+`);
+    }
+};

package/dist/cjs/lib/builder/output-vercel.js

@@ -0,0 +1,89 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "emitVercelOutput", {
+    enumerable: true,
+    get: function() {
+        return emitVercelOutput;
+    }
+});
+const _nodepath = /*#__PURE__*/ _interop_require_default(require("node:path"));
+const _nodefs = require("node:fs");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const emitVercelOutput = async (rootDir, config, rscFiles, htmlFiles, ssr)=>{
+    const publicDir = _nodepath.default.join(rootDir, config.distDir, config.publicDir);
+    const outputDir = _nodepath.default.resolve('.vercel', 'output');
+    (0, _nodefs.cpSync)(_nodepath.default.join(rootDir, config.distDir, config.publicDir), _nodepath.default.join(outputDir, 'static'), {
+        recursive: true
+    });
+    // for serverless function
+    const serverlessDir = _nodepath.default.join(outputDir, 'functions', config.rscPath + '.func');
+    (0, _nodefs.mkdirSync)(_nodepath.default.join(serverlessDir, config.distDir), {
+        recursive: true
+    });
+    (0, _nodefs.mkdirSync)(_nodepath.default.join(serverlessDir, 'node_modules'), {
+        recursive: true
+    });
+    (0, _nodefs.cpSync)(_nodepath.default.join(rootDir, 'node_modules', 'waku'), _nodepath.default.join(serverlessDir, 'node_modules', 'waku'), {
+        dereference: true,
+        recursive: true
+    });
+    (0, _nodefs.cpSync)(_nodepath.default.join(rootDir, config.distDir), _nodepath.default.join(serverlessDir, config.distDir), {
+        recursive: true
+    });
+    const vcConfigJson = {
+        runtime: 'nodejs18.x',
+        handler: 'serve.js',
+        launcherType: 'Nodejs'
+    };
+    (0, _nodefs.writeFileSync)(_nodepath.default.join(serverlessDir, '.vc-config.json'), JSON.stringify(vcConfigJson, null, 2));
+    (0, _nodefs.writeFileSync)(_nodepath.default.join(serverlessDir, 'package.json'), JSON.stringify({
+        type: 'module'
+    }, null, 2));
+    (0, _nodefs.writeFileSync)(_nodepath.default.join(serverlessDir, 'serve.js'), `
+import path from 'node:path';
+import { connectMiddleware } from 'waku';
+const entries = import(path.resolve('${config.distDir}', '${config.entriesJs}'));
+export default async function handler(req, res) {
+  connectMiddleware({ entries, ssr: ${ssr} })(req, res, () => {
+    res.statusCode = 404;
+    res.end();
+  });
+}
+`);
+    const overrides = Object.fromEntries(rscFiles.filter((file)=>!_nodepath.default.extname(file)).map((file)=>[
+            _nodepath.default.relative(publicDir, file),
+            {
+                contentType: 'text/plain'
+            }
+        ]));
+    const basePrefix = config.basePath + config.rscPath + '/';
+    const routes = [
+        {
+            src: basePrefix + '(.*)',
+            dest: basePrefix
+        },
+        ...ssr ? htmlFiles.map((htmlFile)=>{
+            const file = config.basePath + _nodepath.default.relative(publicDir, htmlFile);
+            const src = file.endsWith('/' + config.indexHtml) ? file.slice(0, -('/' + config.indexHtml).length) || '/' : file;
+            return {
+                src,
+                dest: basePrefix
+            };
+        }) : []
+    ];
+    const configJson = {
+        version: 3,
+        overrides,
+        routes
+    };
+    (0, _nodefs.mkdirSync)(outputDir, {
+        recursive: true
+    });
+    (0, _nodefs.writeFileSync)(_nodepath.default.join(outputDir, 'config.json'), JSON.stringify(configJson, null, 2));
+};

package/dist/cjs/lib/plugins/vite-plugin-rsc-delegate.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, "rscDelegatePlugin", {
 });
 const _nodepath = /*#__PURE__*/ _interop_require_default(require("node:path"));
 const _core = /*#__PURE__*/ _interop_require_wildcard(require("@swc/core"));
-const _path = require("../utils/path.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -62,13 +61,17 @@ const CSS_LANGS_RE = /\.(css|less|sass|scss|styl|stylus|pcss|postcss|sss)(?:$|\?
 function rscDelegatePlugin(importCallback) {
     let mode = 'development';
     let base = '/';
+    let server;
     return {
         name: 'rsc-delegate-plugin',
         configResolved (config) {
             mode = config.mode;
             base = config.base;
         },
-        transform (code, id) {
+        configureServer (serverInstance) {
+            server = serverInstance;
+        },
+        async transform (code, id) {
             const ext = _nodepath.default.extname(id);
             if (mode === 'development' && [
                 '.ts',
@@ -87,10 +90,13 @@ function rscDelegatePlugin(importCallback) {
                             const source = base + '@id/__x00__' + item.source.value;
                             importCallback(source);
                         } else if (CSS_LANGS_RE.test(item.source.value)) {
-                            const filePath = _nodepath.default.join(_nodepath.default.dirname(id), item.source.value);
-                            // HACK this relies on Vite's internal implementation detail.
-                            const source = base + '@fs' + (0, _path.encodeFilePathToAbsolute)(filePath);
-                            importCallback(source);
+                            const resolvedSource = await server.pluginContainer.resolveId(item.source.value, id, {
+                                ssr: true
+                            });
+                            if (resolvedSource?.id) {
+                                const transformedResult = await server.transformRequest(resolvedSource.id);
+                                transformedResult && importCallback(transformedResult);
+                            }
                         }
                     }
                 }

package/dist/cjs/lib/plugins/vite-plugin-rsc-hmr.js

@@ -12,36 +12,37 @@ _export(exports, {
     hotImport: function() {
         return hotImport;
     },
+    moduleImport: function() {
+        return moduleImport;
+    },
     rscHmrPlugin: function() {
         return rscHmrPlugin;
     }
 });
-const _nodepath = /*#__PURE__*/ _interop_require_default(require("node:path"));
-function _interop_require_default(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
-    };
-}
 const customCode = `
+import { createHotContext as __vite__createHotContext } from "/@vite/client";
+import.meta.hot = __vite__createHotContext(import.meta.url);
+
 if (import.meta.hot && !globalThis.__WAKU_HMR_CONFIGURED__) {
   globalThis.__WAKU_HMR_CONFIGURED__ = true;
+
   import.meta.hot.on('hot-import', (data) => import(/* @vite-ignore */ data));
+
+  import.meta.hot.on('module', (data) => {
+    const code = data.code;
+    const script = document.createElement('script');
+    script.type = 'module';
+    script.text = code;
+    document.head.appendChild(script);
+  });
 }
 `;
 function rscHmrPlugin() {
     return {
         name: 'rsc-hmr-plugin',
-        async transform (code, id) {
-            const ext = _nodepath.default.extname(id);
-            if ([
-                '.ts',
-                '.tsx',
-                '.js',
-                '.jsx'
-            ].includes(ext)) {
-                return code + customCode;
-            }
-            return code;
+        enforce: 'post',
+        transformIndexHtml (html) {
+            return html.replace('</body>', `<script type="module" async>${customCode}</script></body>`);
         }
     };
 }
@@ -68,3 +69,26 @@ function hotImport(vite, source) {
         data: source
     });
 }
+const modulePendingMap = new WeakMap();
+function moduleImport(viteServer, result) {
+    let sourceSet = modulePendingMap.get(viteServer);
+    if (!sourceSet) {
+        sourceSet = new Set();
+        modulePendingMap.set(viteServer, sourceSet);
+        viteServer.ws.on('connection', ()=>{
+            for (const result of sourceSet){
+                viteServer.ws.send({
+                    type: 'custom',
+                    event: 'module',
+                    data: result
+                });
+            }
+        });
+    }
+    sourceSet.add(result);
+    viteServer.ws.send({
+        type: 'custom',
+        event: 'module',
+        data: result
+    });
+}

package/dist/cjs/lib/rsc/handler-dev.js

@@ -22,6 +22,7 @@ const _vitepluginnonjsresolve = require("../plugins/vite-plugin-nonjs-resolve.js
 const _patchreactrefresh = require("../plugins/patch-react-refresh.js");
 const _vitepluginrscindex = require("../plugins/vite-plugin-rsc-index.js");
 const _vitepluginrschmr = require("../plugins/vite-plugin-rsc-hmr.js");
+const _mergeviteconfig = require("../utils/merge-vite-config.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -34,7 +35,7 @@ function createHandler(options) {
     }
     const configPromise = (0, _config.resolveConfig)(options.config || {});
     const vitePromise = configPromise.then(async (config)=>{
-        const viteServer = await (0, _vite.createServer)({
+        const mergedViteConfig = await (0, _mergeviteconfig.mergeUserViteConfig)({
             base: config.basePath,
             optimizeDeps: {
                 include: [
@@ -59,10 +60,12 @@ function createHandler(options) {
                 middlewareMode: true
             }
         });
+        const viteServer = await (0, _vite.createServer)(mergedViteConfig);
         (0, _workerapi.registerReloadCallback)((type)=>viteServer.ws.send({
                 type
             }));
         (0, _workerapi.registerImportCallback)((source)=>(0, _vitepluginrschmr.hotImport)(viteServer, source));
+        (0, _workerapi.registerModuleCallback)((result)=>(0, _vitepluginrschmr.moduleImport)(viteServer, result));
         return viteServer;
     });
     const entries = Promise.all([