rsbuild-plugin-react-router 0.0.1

package/dist/manifest.d.ts

@@ -0,0 +1,14 @@
+import type { Route, PluginOptions, RouteManifestItem } from './types.js';
+import type { RouteConfigEntry } from '@react-router/dev/routes';
+import type { Rspack } from '@rsbuild/core';
+export declare function configRoutesToRouteManifest(appDirectory: string, routes: RouteConfigEntry[], rootId?: string): Record<string, Route>;
+export declare function getReactRouterManifestForDev(routes: Record<string, Route>, options: PluginOptions, clientStats: Rspack.StatsCompilation | undefined, context: string): Promise<{
+    version: string;
+    url: string;
+    entry: {
+        module: string;
+        imports: string[];
+        css: string[];
+    };
+    routes: Record<string, RouteManifestItem>;
+}>;

package/dist/modify-browser-manifest.d.ts

@@ -0,0 +1,12 @@
+import type { Route, PluginOptions } from './types.js';
+import type { Rspack } from '@rsbuild/core';
+/**
+ * Creates a Webpack/Rspack plugin that modifies the browser manifest
+ * @param routes - The routes configuration
+ * @param pluginOptions - The plugin options
+ * @param appDirectory - The application directory
+ * @returns A webpack/rspack plugin
+ */
+export declare function createModifyBrowserManifestPlugin(routes: Record<string, Route>, pluginOptions: PluginOptions, appDirectory: string): {
+    apply(compiler: Rspack.Compiler): void;
+};

package/dist/plugin-utils.d.ts

@@ -0,0 +1,16 @@
+import type { Babel, ParseResult } from './babel.js';
+export declare function validateDestructuredExports(id: Babel.ArrayPattern | Babel.ObjectPattern, exportsToRemove: string[]): void;
+export declare function invalidDestructureError(name: string): Error;
+export declare function toFunctionExpression(decl: Babel.FunctionDeclaration): any;
+export declare function combineURLs(baseURL: string, relativeURL: string): string;
+export declare function stripFileExtension(file: string): string;
+export declare function createRouteId(file: string): string;
+/**
+ * Find a file with any of the supported JavaScript extensions
+ * @param basePath - The base path without extension
+ * @returns The file path with extension if found, or a default path
+ */
+export declare function findEntryFile(basePath: string): string;
+export declare function generateWithProps(): string;
+export declare const removeExports: (ast: ParseResult<Babel.File>, exportsToRemove: string[]) => void;
+export declare const transformRoute: (ast: ParseResult<Babel.File>) => void;

package/dist/server-utils.d.ts

@@ -0,0 +1,16 @@
+import type { Route } from './types.js';
+/**
+ * Generates the server build module content
+ * @param routes The route manifest
+ * @param options Build options
+ * @returns The generated module content as a string
+ */
+declare function generateServerBuild(routes: Record<string, Route>, options: {
+    entryServerPath: string;
+    assetsBuildDirectory: string;
+    basename: string;
+    appDirectory: string;
+    ssr: boolean;
+    federation?: boolean;
+}): string;
+export { generateServerBuild };

package/dist/templates/context.d.ts

@@ -0,0 +1,6 @@
+import type { Context } from 'react';
+export interface Assets {
+    scriptTags: string[];
+    styleTags: string[];
+}
+export declare const AssetsContext: Context<Assets>;

package/dist/templates/entry.client.cjs

@@ -0,0 +1,12 @@
+"use strict";
+let __rslib_import_meta_url__ = 'undefined' == typeof document ? new (require('url'.replace('', ''))).URL('file:' + __filename).href : document.currentScript && document.currentScript.src || new URL('main.js', document.baseURI).href;
+var __webpack_exports__ = {};
+let external_react_namespaceObject = require("react"), client_namespaceObject = require("react-dom/client"), dom_namespaceObject = require("react-router/dom");
+external_react_namespaceObject.startTransition(()=>{
+    (0, client_namespaceObject.hydrateRoot)(document, external_react_namespaceObject.createElement(external_react_namespaceObject.StrictMode, null, external_react_namespaceObject.createElement(dom_namespaceObject.HydratedRouter, null)));
+});
+var __webpack_export_target__ = exports;
+for(var __webpack_i__ in __webpack_exports__)__webpack_export_target__[__webpack_i__] = __webpack_exports__[__webpack_i__];
+__webpack_exports__.__esModule && Object.defineProperty(__webpack_export_target__, '__esModule', {
+    value: !0
+});

package/dist/templates/entry.client.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/templates/entry.client.js

@@ -0,0 +1,6 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import * as __WEBPACK_EXTERNAL_MODULE_react_dom_client_76b1397c__ from "react-dom/client";
+import * as __WEBPACK_EXTERNAL_MODULE_react_router_dom_acbe8c37__ from "react-router/dom";
+__WEBPACK_EXTERNAL_MODULE_react__.startTransition(()=>{
+    (0, __WEBPACK_EXTERNAL_MODULE_react_dom_client_76b1397c__.hydrateRoot)(document, __WEBPACK_EXTERNAL_MODULE_react__.createElement(__WEBPACK_EXTERNAL_MODULE_react__.StrictMode, null, __WEBPACK_EXTERNAL_MODULE_react__.createElement(__WEBPACK_EXTERNAL_MODULE_react_router_dom_acbe8c37__.HydratedRouter, null)));
+});

package/dist/templates/entry.server.cjs

@@ -0,0 +1,49 @@
+"use strict";
+let __rslib_import_meta_url__ = 'undefined' == typeof document ? new (require('url'.replace('', ''))).URL('file:' + __filename).href : document.currentScript && document.currentScript.src || new URL('main.js', document.baseURI).href;
+var __webpack_require__ = {};
+__webpack_require__.d = (exports1, definition)=>{
+    for(var key in definition)__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key) && Object.defineProperty(exports1, key, {
+        enumerable: !0,
+        get: definition[key]
+    });
+}, __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop), __webpack_require__.r = (exports1)=>{
+    'undefined' != typeof Symbol && Symbol.toStringTag && Object.defineProperty(exports1, Symbol.toStringTag, {
+        value: 'Module'
+    }), Object.defineProperty(exports1, '__esModule', {
+        value: !0
+    });
+};
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__), __webpack_require__.d(__webpack_exports__, {
+    default: ()=>handleRequest
+});
+let external_node_stream_namespaceObject = require("node:stream"), node_namespaceObject = require("@react-router/node"), external_isbot_namespaceObject = require("isbot"), external_react_namespaceObject = require("react"), server_namespaceObject = require("react-dom/server"), external_react_router_namespaceObject = require("react-router"), ABORT_DELAY = 5000;
+function handleRequest(request, responseStatusCode, responseHeaders, routerContext) {
+    return new Promise((resolve, reject)=>{
+        let shellRendered = !1, statusCode = responseStatusCode, userAgent = request.headers.get('user-agent'), readyOption = userAgent && (0, external_isbot_namespaceObject.isbot)(userAgent) || routerContext.isSpaMode ? 'onAllReady' : 'onShellReady', { pipe, abort } = (0, server_namespaceObject.renderToPipeableStream)(external_react_namespaceObject.createElement(external_react_router_namespaceObject.ServerRouter, {
+            context: routerContext,
+            url: request.url
+        }), {
+            [readyOption] () {
+                shellRendered = !0;
+                let body = new external_node_stream_namespaceObject.PassThrough(), stream = (0, node_namespaceObject.createReadableStreamFromReadable)(body);
+                responseHeaders.set('Content-Type', 'text/html'), resolve(new Response(stream, {
+                    headers: responseHeaders,
+                    status: statusCode
+                })), pipe(body);
+            },
+            onShellError (error) {
+                reject(error);
+            },
+            onError (error) {
+                statusCode = 500, shellRendered && console.error(error);
+            }
+        });
+        setTimeout(abort, 5000);
+    });
+}
+var __webpack_export_target__ = exports;
+for(var __webpack_i__ in __webpack_exports__)__webpack_export_target__[__webpack_i__] = __webpack_exports__[__webpack_i__];
+__webpack_exports__.__esModule && Object.defineProperty(__webpack_export_target__, '__esModule', {
+    value: !0
+});

package/dist/templates/entry.server.d.ts

@@ -0,0 +1,2 @@
+import type { EntryContext } from 'react-router';
+export default function handleRequest(request: Request, responseStatusCode: number, responseHeaders: Headers, routerContext: EntryContext): Promise<Response>;

package/dist/templates/entry.server.js

@@ -0,0 +1,31 @@
+import * as __WEBPACK_EXTERNAL_MODULE_node_stream_444d1c2b__ from "node:stream";
+import * as __WEBPACK_EXTERNAL_MODULE__react_router_node_fff52f02__ from "@react-router/node";
+import * as __WEBPACK_EXTERNAL_MODULE_isbot__ from "isbot";
+import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import * as __WEBPACK_EXTERNAL_MODULE_react_dom_server_98c38d5c__ from "react-dom/server";
+import * as __WEBPACK_EXTERNAL_MODULE_react_router_65608a1a__ from "react-router";
+function handleRequest(request, responseStatusCode, responseHeaders, routerContext) {
+    return new Promise((resolve, reject)=>{
+        let shellRendered = !1, statusCode = responseStatusCode, userAgent = request.headers.get('user-agent'), readyOption = userAgent && (0, __WEBPACK_EXTERNAL_MODULE_isbot__.isbot)(userAgent) || routerContext.isSpaMode ? 'onAllReady' : 'onShellReady', { pipe, abort } = (0, __WEBPACK_EXTERNAL_MODULE_react_dom_server_98c38d5c__.renderToPipeableStream)(__WEBPACK_EXTERNAL_MODULE_react__.createElement(__WEBPACK_EXTERNAL_MODULE_react_router_65608a1a__.ServerRouter, {
+            context: routerContext,
+            url: request.url
+        }), {
+            [readyOption] () {
+                shellRendered = !0;
+                let body = new __WEBPACK_EXTERNAL_MODULE_node_stream_444d1c2b__.PassThrough(), stream = (0, __WEBPACK_EXTERNAL_MODULE__react_router_node_fff52f02__.createReadableStreamFromReadable)(body);
+                responseHeaders.set('Content-Type', 'text/html'), resolve(new Response(stream, {
+                    headers: responseHeaders,
+                    status: statusCode
+                })), pipe(body);
+            },
+            onShellError (error) {
+                reject(error);
+            },
+            onError (error) {
+                statusCode = 500, shellRendered && console.error(error);
+            }
+        });
+        setTimeout(abort, 5000);
+    });
+}
+export { handleRequest as default };

package/dist/transform-route-federation.d.ts

@@ -0,0 +1,6 @@
+import type { TransformArgs } from './types.js';
+/**
+ * Transforms route modules with the react-router-route-federation resource query
+ * This handles proper code transformation for federated routes
+ */
+export declare function transformRouteFederation(args: TransformArgs): Promise<string>;

package/dist/types.d.ts

@@ -0,0 +1,49 @@
+export type Route = {
+    id: string;
+    parentId?: string;
+    file: string;
+    path?: string;
+    index?: boolean;
+    caseSensitive?: boolean;
+    children?: Route[];
+};
+export type PluginOptions = {
+    /**
+     * Whether to disable automatic middleware setup for custom server implementation.
+     * Use this when you want to handle server setup manually.
+     * @default false
+     */
+    customServer?: boolean;
+    /**
+     * The output format for server builds.
+     * When set to "module", no package.json will be emitted.
+     * @default "module"
+     */
+    serverOutput?: 'module' | 'commonjs';
+    /**
+     * Federation mode configuration
+     */
+    federation?: boolean;
+};
+/**
+ * Arguments passed to transform functions
+ */
+export type TransformArgs = {
+    code: string;
+    resource: string;
+    resourcePath: string;
+    context?: string | null;
+    environment?: {
+        name: string;
+    };
+};
+export type RouteManifestItem = Omit<Route, 'file' | 'children'> & {
+    module: string;
+    hasAction: boolean;
+    hasLoader: boolean;
+    hasClientAction: boolean;
+    hasClientLoader: boolean;
+    hasErrorBoundary: boolean;
+    imports: string[];
+    css: string[];
+};

package/package.json

@@ -0,0 +1,122 @@
+{
+  "name": "rsbuild-plugin-react-router",
+  "version": "0.0.1",
+  "description": "React Router plugin for Rsbuild",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/rspack-contrib/rsbuild-plugin-react-router.git",
+    "directory": ""
+  },
+  "keywords": [
+    "rsbuild",
+    "rsbuild-plugin",
+    "react-router",
+    "react",
+    "router",
+    "ssr",
+    "rspack",
+    "plugin",
+    "remix",
+    "module-federation"
+  ],
+  "license": "MIT",
+  "type": "module",
+  "registry": "https://registry.npmjs.org/",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    },
+    "./templates/entry.client": {
+      "types": "./dist/templates/entry.client.d.ts",
+      "import": "./dist/templates/entry.client.js",
+      "require": "./dist/templates/entry.client.cjs"
+    },
+    "./templates/entry.server": {
+      "types": "./dist/templates/entry.server.d.ts",
+      "import": "./dist/templates/entry.server.js",
+      "require": "./dist/templates/entry.server.cjs"
+    }
+  },
+  "main": "./dist/index.cjs",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "publint": {
+    "ignoreMissingDts": true
+  },
+  "dependencies": {
+    "@babel/core": "^7.26.3",
+    "@babel/generator": "^7.26.3",
+    "@babel/parser": "^7.26.3",
+    "@babel/traverse": "^7.26.3",
+    "@babel/types": "^7.26.3",
+    "@mjackson/node-fetch-server": "^0.3.0",
+    "@react-router/node": "^7.4.0",
+    "@rspack/plugin-react-refresh": "^1.0.1",
+    "babel-dead-code-elimination": "^1.0.8",
+    "esbuild": "^0.24.2",
+    "execa": "^9.5.2",
+    "fs-extra": "11.3.0",
+    "isbot": "5.1.18",
+    "jiti": "^2.4.2",
+    "jsesc": "^3.1.0",
+    "pathe": "^1.1.2",
+    "react-refresh": "^0.16.0",
+    "rspack-plugin-virtual-module": "^0.1.13"
+  },
+  "devDependencies": {
+    "@changesets/cli": "^2.28.1",
+    "@react-router/dev": "^7.4.0",
+    "@react-router/node": "^7.4.0",
+    "@rsbuild/core": "^1.2.19",
+    "@rslib/core": "^0.5.4",
+    "@rspack/core": "npm:@rspack-canary/core@1.3.0-canary-ce784815-20250320233859",
+    "@types/babel__core": "^7.6.8",
+    "@types/babel__generator": "^7.6.8",
+    "@types/babel__traverse": "^7.20.6",
+    "@types/fs-extra": "11.0.4",
+    "@types/jsesc": "^3.0.3",
+    "@types/node": "^22.10.1",
+    "@types/react": "^19.0.1",
+    "@types/react-dom": "^19.0.1",
+    "jiti": "^2.4.1",
+    "kill-port": "^2.0.1",
+    "killport": "^1.0.2",
+    "playwright": "^1.50.1",
+    "prettier": "3.4.2",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-router": "^7.4.0",
+    "react-router-dom": "^7.4.0",
+    "typescript": "^5.7.2",
+    "vitest": "^3.0.5",
+    "@rsbuild/config": "1.0.1"
+  },
+  "peerDependencies": {
+    "@rsbuild/core": "1.x"
+  },
+  "publishConfig": {
+    "access": "public",
+    "provenance": false,
+    "registry": "https://registry.npmjs.org/"
+  },
+  "scripts": {
+    "build": "rslib build",
+    "e2e": "pnpm build && cd examples/default-template && pnpm test:e2e && npx kill-port 3000 && cd ../custom-node-server && pnpm test:e2e",
+    "dev": "rslib build --watch",
+    "test": "vitest run",
+    "test:watch": "vitest watch",
+    "test:coverage": "vitest run --coverage",
+    "test:core": "vitest run -c ./vitest.config.ts",
+    "test:core:watch": "vitest watch -c ./vitest.config.ts",
+    "format": "prettier --write \"src/**/*.{js,jsx,ts,tsx}\"",
+    "format:check": "prettier --check \"src/**/*.{js,jsx,ts,tsx}\"",
+    "changeset": "changeset",
+    "version": "changeset version",
+    "release": "changeset publish",
+    "release:local": "pnpm build && changeset version && changeset publish"
+  }
+}