Improve logging

Author: markdalgleish

packages/react-router-dev/config/config.ts

@@ -486,6 +486,7 @@ type ChokidarEventName = ChokidarEmitArgs[0];
 
 type ChangeHandler = (args: {
   result: Result<ResolvedReactRouterConfig>;
+  configCodeUpdated: boolean;
   routeConfigChanged: boolean;
   path: string;
   event: ChokidarEventName;
@@ -531,6 +532,8 @@ export async function createConfigLoader({
     appDirectory = initialConfigResult.value.appDirectory;
   }
 
+  let lastConfig = initialConfigResult.value;
+
   let fsWatcher: FSWatcher | undefined;
   let changeHandlers: ChangeHandler[] = [];
 
@@ -562,32 +565,39 @@ export async function createConfigLoader({
             event === "change" &&
             filepath === path.normalize(reactRouterConfigFile);
 
-          let configModuleGraphChanged = Boolean(
+          let configCodeUpdated = Boolean(
             viteNodeContext.devServer?.moduleGraph.getModuleById(filepath)
           );
 
-          if (configModuleGraphChanged || appFileAddedOrRemoved) {
+          if (configCodeUpdated || appFileAddedOrRemoved) {
             viteNodeContext.devServer?.moduleGraph.invalidateAll();
             viteNodeContext.runner?.moduleCache.clear();
           }
 
-          // todo: isolate from rest of config
-          let routeConfigChanged = configModuleGraphChanged;
-
           if (
             appFileAddedOrRemoved ||
             reactRouterConfigFileChanged ||
-            configModuleGraphChanged
+            configCodeUpdated
           ) {
             let result = await getConfig();
+
+            let routeConfigChanged =
+              result.ok &&
+              !isEqualJson(lastConfig?.routes, result.value.routes);
+
             for (let handler of changeHandlers) {
               handler({
                 result,
+                configCodeUpdated,
                 routeConfigChanged,
                 path: filepath,
                 event,
               });
             }
+
+            if (result.ok) {
+              lastConfig = result.value;
+            }
           }
         });
       }
@@ -629,3 +639,7 @@ function findEntry(
 
   return undefined;
 }
+
+function isEqualJson(v1: unknown, v2: unknown) {
+  return JSON.stringify(v1) === JSON.stringify(v2);
+}

packages/react-router-dev/vite/plugin.ts

@@ -1081,7 +1081,7 @@ export const reactRouterVitePlugin: ReactRouterVitePlugin = () => {
         });
 
         reactRouterConfigLoader.onChange(
-          async ({ result, routeConfigChanged }) => {
+          async ({ result, configCodeUpdated, routeConfigChanged }) => {
             if (result.ok) {
               let lastReactRouterConfig = ctx.reactRouterConfig;
 
@@ -1090,6 +1090,11 @@ export const reactRouterVitePlugin: ReactRouterVitePlugin = () => {
                   clear: true,
                   timestamp: true,
                 });
+              } else if (configCodeUpdated) {
+                logger.info(colors.green("Config updated."), {
+                  clear: true,
+                  timestamp: true,
+                });
               }
 
               await updatePluginContext();