chore: add prettier

Author: ScriptedAlchemy

package.json

@@ -39,7 +39,9 @@
     "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"
+    "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}\""
   },
   "dependencies": {
     "@babel/core": "^7.26.3",
@@ -76,6 +78,7 @@
     "@types/react-dom": "^19.0.1",
     "jiti": "^2.4.1",
     "playwright": "^1.50.1",
+    "prettier": "3.4.2",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "react-router": "^7.4.0",

pnpm-lock.yaml

@@ -6,7 +6,7 @@ export const JS_LOADERS = {
   '.ts': 'ts',
   '.tsx': 'tsx',
   '.js': 'js',
-  '.jsx': 'jsx'
+  '.jsx': 'jsx',
 } as const;
 
 export const SERVER_ONLY_ROUTE_EXPORTS = [

src/constants.ts

@@ -8,11 +8,13 @@ export type DevServerMiddleware = (
 ) => Promise<void>;
 
 export const createDevServerMiddleware = (server: any): DevServerMiddleware => {
-  return async (req: IncomingMessage, res: ServerResponse, next: (err?: any) => void): Promise<void> => {
+  return async (
+    req: IncomingMessage,
+    res: ServerResponse,
+    next: (err?: any) => void
+  ): Promise<void> => {
     try {
-      const bundle = (await server.environments.node.loadBundle(
-        'app',
-      ));
+      const bundle = await server.environments.node.loadBundle('app');
 
       if (!bundle || !bundle.routes) {
         throw new Error('Server bundle not found or invalid');

src/dev-server.ts

@@ -11,14 +11,14 @@ import { generate, parse } from './babel.js';
 import { PLUGIN_NAME, SERVER_ONLY_ROUTE_EXPORTS } from './constants.js';
 import { createDevServerMiddleware } from './dev-server.js';
 import {
-    generateWithProps,
-    removeExports,
-    transformRoute,
-    findEntryFile
+  generateWithProps,
+  removeExports,
+  transformRoute,
+  findEntryFile,
 } from './plugin-utils.js';
 import {
-    configRoutesToRouteManifest,
-    getReactRouterManifestForDev
+  configRoutesToRouteManifest,
+  getReactRouterManifestForDev,
 } from './manifest.js';
 import { generateServerBuild } from './server-utils.js';
 import { createModifyBrowserManifestPlugin } from './modify-browser-manifest.js';
@@ -39,7 +39,6 @@ export type PluginOptions = {
   serverOutput?: 'module' | 'commonjs';
 };
 
-
 export type Route = {
   id: string;
   parentId?: string;
@@ -62,7 +61,7 @@ export type RouteManifestItem = Omit<Route, 'file' | 'children'> & {
 };
 
 export const pluginReactRouter = (
-  options: PluginOptions = {},
+  options: PluginOptions = {}
 ): RsbuildPlugin => ({
   name: PLUGIN_NAME,
 
@@ -90,27 +89,27 @@ export const pluginReactRouter = (
           const source = new RawSource(
             JSON.stringify({
               type: 'commonjs',
-            }),
+            })
           );
 
           if (compilation.getAsset(packageJsonPath)) {
             compilation.updateAsset(packageJsonPath, source);
           } else {
             compilation.emitAsset(packageJsonPath, source);
           }
-        },
+        }
       );
     }
 
     // Run typegen on build/dev
     api.onBeforeStartDevServer(async () => {
       const { $ } = await import('execa');
-       $`npx --yes react-router typegen --watch`;
+      $`npx --yes react-router typegen --watch`;
     });
 
     api.onBeforeBuild(async () => {
       const { $ } = await import('execa');
-       $`npx --yes react-router typegen`;
+      $`npx --yes react-router typegen`;
     });
 
     const jiti = createJiti(process.cwd());
@@ -127,7 +126,7 @@ export const pluginReactRouter = (
       })
       .catch(() => {
         console.error(
-          'No react-router.config.ts found, using default configuration.',
+          'No react-router.config.ts found, using default configuration.'
         );
         return {} as Config;
       });
@@ -139,25 +138,25 @@ export const pluginReactRouter = (
       .import<RouteConfigEntry[]>(routesPath, {
         default: true,
       })
-      .catch((error) => {
+      .catch(error => {
         console.error('Failed to load routes.ts:', error);
         console.error('No routes.ts found in app directory.');
         return [] as RouteConfigEntry[];
       });
 
     // Remove local JS_EXTENSIONS definition - use the imported one instead
-    
+
     // Remove duplicate findEntryFile implementation
     const entryClientPath = findEntryFile(
-      resolve(appDirectory, 'entry.client'),
+      resolve(appDirectory, 'entry.client')
     );
     const entryServerPath = findEntryFile(
-      resolve(appDirectory, 'entry.server'),
+      resolve(appDirectory, 'entry.server')
     );
 
     // Check for server app file
     const serverAppPath = findEntryFile(
-      resolve(appDirectory, '../server/index'),
+      resolve(appDirectory, '../server/index')
     );
     const hasServerApp = existsSync(serverAppPath);
 
@@ -176,7 +175,7 @@ export const pluginReactRouter = (
 
     const rootRouteFile = relative(
       appDirectory,
-      resolve(appDirectory, 'root.tsx'),
+      resolve(appDirectory, 'root.tsx')
     );
 
     const routes = {
@@ -241,13 +240,10 @@ export const pluginReactRouter = (
                 ...Object.values(routes).reduce(
                   (acc: Record<string, string>, route) => {
                     acc[route.file.slice(0, route.file.lastIndexOf('.'))] =
-                      `${resolve(
-                        appDirectory,
-                        route.file,
-                      )}?react-router-route`;
+                      `${resolve(appDirectory, route.file)}?react-router-route`;
                     return acc;
                   },
-                  {} as Record<string, string>,
+                  {} as Record<string, string>
                 ),
               },
             },
@@ -305,8 +301,14 @@ export const pluginReactRouter = (
                 externalsType: pluginOptions.serverOutput,
                 output: {
                   chunkFormat: pluginOptions.serverOutput,
-                  chunkLoading: pluginOptions.serverOutput === 'module' ? 'import' : 'require',
-                  workerChunkLoading: pluginOptions.serverOutput === 'module' ? 'import' : 'require',
+                  chunkLoading:
+                    pluginOptions.serverOutput === 'module'
+                      ? 'import'
+                      : 'require',
+                  workerChunkLoading:
+                    pluginOptions.serverOutput === 'module'
+                      ? 'import'
+                      : 'require',
                   wasmLoading: 'fetch',
                   library: { type: pluginOptions.serverOutput },
                   module: pluginOptions.serverOutput === 'module',
@@ -324,10 +326,14 @@ export const pluginReactRouter = (
         if (name === 'web') {
           return mergeEnvironmentConfig(config, {
             tools: {
-              rspack: (rspackConfig) => {
+              rspack: rspackConfig => {
                 if (rspackConfig.plugins) {
                   rspackConfig.plugins.push(
-                    createModifyBrowserManifestPlugin(routes, pluginOptions, appDirectory)
+                    createModifyBrowserManifestPlugin(
+                      routes,
+                      pluginOptions,
+                      appDirectory
+                    )
                   );
                 }
                 return rspackConfig;
@@ -336,29 +342,31 @@ export const pluginReactRouter = (
           });
         }
         return config;
-      },
+      }
     );
 
     api.processAssets(
       { stage: 'additional', targets: ['node'] },
       ({ sources, compilation }) => {
         const packageJsonPath = 'package.json';
-        const source = new sources.RawSource(`{"type": "${pluginOptions.serverOutput}"}`);
+        const source = new sources.RawSource(
+          `{"type": "${pluginOptions.serverOutput}"}`
+        );
 
         if (compilation.getAsset(packageJsonPath)) {
           compilation.updateAsset(packageJsonPath, source);
         } else {
           compilation.emitAsset(packageJsonPath, source);
         }
-      },
+      }
     );
 
     // Add manifest transformations
     api.transform(
       {
         test: /virtual\/react-router\/(browser|server)-manifest/,
       },
-      async (args) => {
+      async args => {
         // For browser manifest, return a placeholder that will be modified by the plugin
         if (args.environment.name === 'web') {
           return {
@@ -376,15 +384,15 @@ export const pluginReactRouter = (
         return {
           code: `export default ${jsesc(manifest, { es6: true })};`,
         };
-      },
+      }
     );
 
     // Add route transformation
     api.transform(
       {
         resourceQuery: /\?react-router-route/,
       },
-      async (args) => {
+      async args => {
         let code = (
           await esbuild.transform(args.code, {
             jsx: 'automatic',
@@ -395,7 +403,7 @@ export const pluginReactRouter = (
         ).code;
 
         const defaultExportMatch = code.match(
-          /\n\s{0,}([\w\d_]+)\sas default,?/,
+          /\n\s{0,}([\w\d_]+)\sas default,?/
         );
         if (
           defaultExportMatch &&
@@ -419,7 +427,7 @@ export const pluginReactRouter = (
           filename: args.resource,
           sourceFileName: args.resourcePath,
         });
-      },
+      }
     );
   },
 });