@tanstack/router-plugin 1.95.5 → 1.96.0

package/src/core/router-code-splitter-plugin.ts

@@ -1,6 +1,7 @@
 import { isAbsolute, join, normalize } from 'node:path'
-import { fileURLToPath, pathToFileURL } from 'node:url'
 
+import { fileURLToPath, pathToFileURL } from 'node:url'
+import { logDiff } from '../logger'
 import { getConfig } from './config'
 import {
   compileCodeSplitReferenceRoute,
@@ -11,6 +12,10 @@ import { splitPrefix } from './constants'
 import type { Config } from './config'
 import type { UnpluginContextMeta, UnpluginFactory } from 'unplugin'
 
+const debug =
+  process.env.TSR_VITE_DEBUG &&
+  ['true', 'router-plugin'].includes(process.env.TSR_VITE_DEBUG)
+
 function capitalizeFirst(str: string): string {
   return str.charAt(0).toUpperCase() + str.slice(1)
 }
@@ -57,26 +62,15 @@ plugins: [
 }
 
 const PLUGIN_NAME = 'unplugin:router-code-splitter'
-const JoinedSplitPrefix = splitPrefix + ':'
 
 export const unpluginRouterCodeSplitterFactory: UnpluginFactory<
   Partial<Config> | undefined
 > = (options = {}, { framework }) => {
-  const debug = Boolean(process.env.TSR_VITE_DEBUG)
-
   let ROOT: string = process.cwd()
   let userConfig = options as Config
 
   const handleSplittingFile = (code: string, id: string) => {
-    if (debug) console.info('Splitting route: ', id)
-
-    if (debug) console.info('')
-    if (debug) console.info('Split Route Input: ', id)
-    if (debug) console.info('')
-    if (debug) console.info(code)
-    if (debug) console.info('')
-    if (debug) console.info('')
-    if (debug) console.info('')
+    if (debug) console.info('Splitting Route: ', id)
 
     const compiledVirtualRoute = compileCodeSplitVirtualRoute({
       code,
@@ -84,19 +78,16 @@ export const unpluginRouterCodeSplitterFactory: UnpluginFactory<
       filename: id,
     })
 
-    if (debug) console.info('')
-    if (debug) console.info('Split Route Output: ', id)
-    if (debug) console.info('')
-    if (debug) console.info(compiledVirtualRoute.code)
-    if (debug) console.info('')
-    if (debug) console.info('')
-    if (debug) console.info('')
+    if (debug) {
+      logDiff(code, compiledVirtualRoute.code)
+      console.log('Output:\n', compiledVirtualRoute.code)
+    }
 
     return compiledVirtualRoute
   }
 
   const handleCompilingFile = (code: string, id: string) => {
-    if (debug) console.info('Handling createRoute: ', id)
+    if (debug) console.info('Compiling Route: ', id)
 
     const compiledReferenceRoute = compileCodeSplitReferenceRoute({
       code,
@@ -104,13 +95,10 @@ export const unpluginRouterCodeSplitterFactory: UnpluginFactory<
       filename: id,
     })
 
-    if (debug) console.info('')
-    if (debug) console.info('Handling createRoute output: ', id)
-    if (debug) console.info('')
-    if (debug) console.info(compiledReferenceRoute.code)
-    if (debug) console.info('')
-    if (debug) console.info('')
-    if (debug) console.info('')
+    if (debug) {
+      logDiff(code, compiledReferenceRoute.code)
+      console.log('Output:\n', compiledReferenceRoute.code + '\n\n')
+    }
 
     return compiledReferenceRoute
   }
@@ -119,17 +107,6 @@ export const unpluginRouterCodeSplitterFactory: UnpluginFactory<
     name: 'router-code-splitter-plugin',
     enforce: 'pre',
 
-    resolveId(source) {
-      if (!userConfig.autoCodeSplitting) {
-        return null
-      }
-
-      if (source.startsWith(splitPrefix + ':')) {
-        return source.replace(splitPrefix + ':', '')
-      }
-      return null
-    },
-
     transform(code, id) {
       if (!userConfig.autoCodeSplitting) {
         return null
@@ -161,17 +138,11 @@ export const unpluginRouterCodeSplitterFactory: UnpluginFactory<
       return null
     },
 
-    transformInclude(transformId) {
+    transformInclude(id) {
       if (!userConfig.autoCodeSplitting) {
         return undefined
       }
 
-      let id = transformId
-
-      if (id.startsWith(JoinedSplitPrefix)) {
-        id = id.replace(JoinedSplitPrefix, '')
-      }
-
       if (
         fileIsInRoutesDirectory(id, userConfig.routesDirectory) ||
         id.includes(splitPrefix)
@@ -191,41 +162,11 @@ export const unpluginRouterCodeSplitterFactory: UnpluginFactory<
 
     rspack(compiler) {
       ROOT = process.cwd()
-
-      compiler.hooks.beforeCompile.tap(PLUGIN_NAME, (self) => {
-        self.normalModuleFactory.hooks.beforeResolve.tap(
-          PLUGIN_NAME,
-          (resolveData: { request: string }) => {
-            if (resolveData.request.includes(JoinedSplitPrefix)) {
-              resolveData.request = resolveData.request.replace(
-                JoinedSplitPrefix,
-                '',
-              )
-            }
-          },
-        )
-      })
-
       userConfig = getConfig(options, ROOT)
     },
 
     webpack(compiler) {
       ROOT = process.cwd()
-
-      compiler.hooks.beforeCompile.tap(PLUGIN_NAME, (self) => {
-        self.normalModuleFactory.hooks.beforeResolve.tap(
-          PLUGIN_NAME,
-          (resolveData: { request: string }) => {
-            if (resolveData.request.includes(JoinedSplitPrefix)) {
-              resolveData.request = resolveData.request.replace(
-                JoinedSplitPrefix,
-                '',
-              )
-            }
-          },
-        )
-      })
-
       userConfig = getConfig(options, ROOT)
 
       if (

package/src/logger.ts

@@ -0,0 +1,59 @@
+import chalk from 'chalk'
+import { diffWords } from 'diff'
+
+export function logDiff(oldStr: string, newStr: string) {
+  const differences = diffWords(oldStr, newStr)
+
+  let output = ''
+  let unchangedLines = ''
+
+  function processUnchangedLines(lines: string): string {
+    const lineArray = lines.split('\n')
+    if (lineArray.length > 4) {
+      return [
+        chalk.dim(lineArray[0]),
+        chalk.dim(lineArray[1]),
+        '',
+        chalk.dim.bold(`... (${lineArray.length - 4} lines) ...`),
+        '',
+        chalk.dim(lineArray[lineArray.length - 2]),
+        chalk.dim(lineArray[lineArray.length - 1]),
+      ].join('\n')
+    }
+    return chalk.dim(lines)
+  }
+
+  differences.forEach((part, index) => {
+    const nextPart = differences[index + 1]
+
+    if (part.added) {
+      if (unchangedLines) {
+        output += processUnchangedLines(unchangedLines)
+        unchangedLines = ''
+      }
+      output += chalk.green.bold(part.value)
+      if (nextPart?.removed) output += ' '
+    } else if (part.removed) {
+      if (unchangedLines) {
+        output += processUnchangedLines(unchangedLines)
+        unchangedLines = ''
+      }
+      output += chalk.red.bold(part.value)
+      if (nextPart?.added) output += ' '
+    } else {
+      unchangedLines += part.value
+    }
+  })
+
+  // Process any remaining unchanged lines at the end
+  if (unchangedLines) {
+    output += processUnchangedLines(unchangedLines)
+  }
+
+  if (output) {
+    console.log('\nDiff:')
+    console.log(output + '\n')
+  } else {
+    console.log('No changes')
+  }
+}