@tanstack/start-plugin-core 1.167.35 → 1.169.0

package/src/rsbuild/post-build.ts

@@ -0,0 +1,96 @@
+import { join } from 'pathe'
+import { postBuild } from '../post-build'
+import { prerender } from '../prerender'
+import type { PrerenderHandler } from '../prerender'
+import type { TanStackStartOutputConfig } from '../schema'
+
+export async function postBuildWithRsbuild({
+  startConfig,
+  clientOutputDirectory,
+  serverOutputDirectory,
+}: {
+  startConfig: TanStackStartOutputConfig
+  clientOutputDirectory: string
+  serverOutputDirectory: string
+}) {
+  await postBuild({
+    startConfig,
+    adapter: {
+      getClientOutputDirectory() {
+        return clientOutputDirectory
+      },
+      prerender(startConfig) {
+        return prerender({
+          startConfig,
+          handler: createRsbuildPrerenderHandler({
+            clientOutputDirectory,
+            serverOutputDirectory,
+          }),
+        })
+      },
+    },
+  })
+}
+
+function createRsbuildPrerenderHandler({
+  clientOutputDirectory,
+  serverOutputDirectory,
+}: {
+  clientOutputDirectory: string
+  serverOutputDirectory: string
+}): PrerenderHandler {
+  process.env.TSS_PRERENDERING = 'true'
+  process.env.TSS_CLIENT_OUTPUT_DIR = clientOutputDirectory
+
+  let requestHandlerPromise:
+    | Promise<
+        (request: Request, opts?: unknown) => Promise<Response> | Response
+      >
+    | undefined
+
+  return {
+    getClientOutputDirectory() {
+      return clientOutputDirectory
+    },
+    async request(path, options) {
+      const requestHandler = await getRequestHandler()
+      const url = new URL(path, 'http://localhost')
+
+      return requestHandler(
+        new Request(url, {
+          ...options,
+          redirect: 'manual',
+        }),
+      )
+    },
+  }
+
+  function getRequestHandler() {
+    if (!requestHandlerPromise) {
+      requestHandlerPromise = loadRequestHandler(serverOutputDirectory)
+    }
+
+    return requestHandlerPromise
+  }
+}
+
+async function loadRequestHandler(serverOutputDirectory: string) {
+  const { pathToFileURL } = await import('node:url')
+  const serverEntryUrl = pathToFileURL(
+    join(serverOutputDirectory, 'index.js'),
+  ).toString()
+  const serverModule = await import(serverEntryUrl)
+  const handler = serverModule.default
+
+  if (typeof handler === 'function') {
+    return handler as (request: Request) => Promise<Response> | Response
+  }
+
+  if (handler && typeof handler.fetch === 'function') {
+    return (request: Request) => handler.fetch(request)
+  }
+
+  throw new Error(
+    `Unable to resolve a request handler from Rsbuild server bundle at ${serverEntryUrl}`,
+  )
+}

package/src/rsbuild/schema.ts

@@ -0,0 +1,31 @@
+import { z } from 'zod'
+import {
+  parseStartConfig as parseCoreStartConfig,
+  tanstackStartOptionsObjectSchema,
+} from '../schema'
+import type { CompileStartFrameworkOptions } from '../types'
+
+export const tanstackStartRsbuildOptionsSchema =
+  tanstackStartOptionsObjectSchema
+    .extend({
+      rsbuild: z
+        .object({ installDevServerMiddleware: z.boolean().optional() })
+        .optional(),
+    })
+    .optional()
+    .default({})
+
+export function parseStartConfig(
+  opts: z.input<typeof tanstackStartRsbuildOptionsSchema>,
+  corePluginOpts: { framework: CompileStartFrameworkOptions },
+  root: string,
+) {
+  const { rsbuild: _rsbuild, ...coreOptions } =
+    tanstackStartRsbuildOptionsSchema.parse(opts)
+
+  return parseCoreStartConfig(coreOptions, corePluginOpts, root)
+}
+
+export type TanStackStartRsbuildInputConfig = z.input<
+  typeof tanstackStartRsbuildOptionsSchema
+>

package/src/rsbuild/start-compiler-host.ts

@@ -0,0 +1,250 @@
+import { AsyncLocalStorage } from 'node:async_hooks'
+import { pathToFileURL } from 'node:url'
+import { TRANSFORM_ID_REGEX } from '../constants'
+import { detectKindsInCode } from '../start-compiler/compiler'
+import { getTransformCodeFilterForEnv } from '../start-compiler/config'
+import {
+  createStartCompiler,
+  matchesCodeFilters,
+  mergeServerFnsById,
+} from '../start-compiler/host'
+import { cleanId } from '../start-compiler/utils'
+import { RSBUILD_ENVIRONMENT_NAMES } from './planning'
+import type { RsbuildPluginAPI, Rspack } from '@rsbuild/core'
+import type { CompileStartFrameworkOptions } from '../types'
+import type {
+  DevServerFnModuleSpecifierEncoder,
+  GenerateFunctionIdFnOptional,
+  ServerFn,
+} from '../start-compiler/types'
+
+type RsbuildTransformContext = Parameters<
+  Parameters<RsbuildPluginAPI['transform']>[1]
+>[0]
+type RsbuildInputFileSystem = NonNullable<Rspack.Compiler['inputFileSystem']>
+
+/**
+ * Rsbuild dev server fn ref strategy: uses file:// URLs for absolute paths.
+ * These are directly importable by Node's ESM VM runner without any bundler
+ * path conventions (unlike Vite's /@id/ prefix).
+ */
+const rsbuildDevServerFnModuleSpecifierEncoder: DevServerFnModuleSpecifierEncoder =
+  ({ extractedFilename }) => pathToFileURL(extractedFilename).href
+
+export interface StartCompilerHostOptions {
+  framework: CompileStartFrameworkOptions
+  root: string | (() => string)
+  providerEnvName: string
+  generateFunctionId?: GenerateFunctionIdFnOptional
+  serverFnsById?: Record<string, ServerFn>
+  onServerFnsByIdChange?: () => void
+}
+
+/**
+ * Registers the shared StartCompiler as rsbuild transforms for client + ssr environments.
+ *
+ * Uses `api.transform()` to hook into the rsbuild loader pipeline, and the
+ * transform context's native `resolve()` for module resolution.
+ */
+export function registerStartCompilerTransforms(
+  api: RsbuildPluginAPI,
+  opts: StartCompilerHostOptions,
+): {
+  serverFnsById: Record<string, ServerFn>
+} {
+  const compilers = new Map<string, ReturnType<typeof createStartCompiler>>()
+  const inputFileSystems = new Map<string, RsbuildInputFileSystem>()
+  const transformContextStorage =
+    new AsyncLocalStorage<RsbuildTransformContext>()
+  const serverFnsById = opts.serverFnsById ?? {}
+  const getRoot = () =>
+    typeof opts.root === 'function' ? opts.root() : opts.root
+
+  const onServerFnsById = (d: Record<string, ServerFn>) => {
+    mergeServerFnsById(serverFnsById, d)
+    opts.onServerFnsByIdChange?.()
+  }
+
+  const isDev = api.context.action === 'dev'
+  const mode = isDev ? 'dev' : 'build'
+
+  const environments: Array<{
+    name: string
+    type: 'client' | 'server'
+  }> = [
+    { name: RSBUILD_ENVIRONMENT_NAMES.client, type: 'client' },
+    { name: RSBUILD_ENVIRONMENT_NAMES.server, type: 'server' },
+  ]
+
+  // Pre-compute code filter patterns per environment type
+  const codeFilters: Record<'client' | 'server', Array<RegExp>> = {
+    client: getTransformCodeFilterForEnv('client'),
+    server: getTransformCodeFilterForEnv('server'),
+  }
+
+  for (const env of environments) {
+    const envCodeFilters = codeFilters[env.type]
+
+    api.transform(
+      {
+        test: TRANSFORM_ID_REGEX[0],
+        environments: [env.name],
+        order: 'pre',
+      },
+      async (ctx: RsbuildTransformContext) => {
+        return transformContextStorage.run(ctx, async () => {
+          const code = ctx.code
+          const id = ctx.resourcePath + (ctx.resourceQuery || '')
+
+          // Quick string-level check: does this file contain any patterns for this env?
+          if (!matchesCodeFilters(code, envCodeFilters)) {
+            return code
+          }
+
+          let compiler = compilers.get(env.name)
+          if (!compiler) {
+            const root = getRoot()
+
+            compiler = createStartCompiler({
+              env: env.type,
+              envName: env.name,
+              root,
+              mode,
+              framework: opts.framework,
+              providerEnvName: opts.providerEnvName,
+              generateFunctionId: opts.generateFunctionId,
+              onServerFnsById,
+              getKnownServerFns: () => serverFnsById,
+              encodeModuleSpecifierInDev: isDev
+                ? rsbuildDevServerFnModuleSpecifierEncoder
+                : undefined,
+              loadModule: async (moduleId: string) => {
+                const activeCtx = transformContextStorage.getStore()
+                if (!activeCtx) {
+                  throw new Error(
+                    `could not load module ${moduleId}: missing active rsbuild transform context for ${env.name}`,
+                  )
+                }
+
+                const inputFileSystem = inputFileSystems.get(env.name)
+                if (!inputFileSystem) {
+                  throw new Error(
+                    `could not load module ${moduleId}: missing rspack input filesystem for ${env.name}`,
+                  )
+                }
+
+                const cleanedId = cleanId(moduleId)
+                activeCtx.addDependency(cleanedId)
+                const loaded = await readFileFromInputFileSystem(
+                  inputFileSystem,
+                  cleanedId,
+                )
+                const moduleCode = Buffer.isBuffer(loaded)
+                  ? loaded.toString('utf8')
+                  : loaded
+
+                compiler!.ingestModule({ code: moduleCode, id: cleanedId })
+              },
+              resolveId: async (
+                source: string,
+                importer?: string,
+              ): Promise<string | null> => {
+                const activeCtx = transformContextStorage.getStore()
+                if (!activeCtx) {
+                  throw new Error(
+                    `could not resolve ${source}: missing active rsbuild transform context for ${env.name}`,
+                  )
+                }
+
+                const context = importer
+                  ? importer.replace(/[/\\][^/\\]*$/, '')
+                  : getRoot()
+
+                return await new Promise((resolve, reject) => {
+                  activeCtx.resolve(context, source, (error, resolved) => {
+                    if (error) {
+                      reject(error)
+                      return
+                    }
+
+                    if (!resolved) {
+                      resolve(null)
+                      return
+                    }
+
+                    resolve(cleanId(resolved))
+                  })
+                })
+              },
+            })
+            compilers.set(env.name, compiler)
+          }
+
+          const detectedKinds = detectKindsInCode(code, env.type)
+          const result = await compiler.compile({ id, code, detectedKinds })
+
+          if (!result) {
+            return code
+          }
+
+          return {
+            code: result.code,
+            map: result.map ?? null,
+          }
+        })
+      },
+    )
+  }
+
+  api.modifyRspackConfig((config, utils) => {
+    config.plugins.push({
+      apply(compiler: Rspack.Compiler) {
+        if (compiler.inputFileSystem) {
+          inputFileSystems.set(utils.environment.name, compiler.inputFileSystem)
+        }
+
+        compiler.hooks.watchRun.tap(
+          'TanStackStartCompilerModuleInvalidation',
+          (watchCompiler) => {
+            const startCompiler = compilers.get(utils.environment.name)
+
+            if (!startCompiler) {
+              return
+            }
+
+            for (const file of watchCompiler.modifiedFiles ?? []) {
+              startCompiler.invalidateModule(file)
+            }
+
+            for (const file of watchCompiler.removedFiles ?? []) {
+              startCompiler.invalidateModule(file)
+            }
+          },
+        )
+      },
+    })
+  })
+
+  return { serverFnsById }
+}
+
+function readFileFromInputFileSystem(
+  inputFileSystem: RsbuildInputFileSystem,
+  file: string,
+): Promise<string | Buffer> {
+  return new Promise((resolve, reject) => {
+    inputFileSystem.readFile(file, (error, data) => {
+      if (error) {
+        reject(error)
+        return
+      }
+
+      if (data == null) {
+        reject(new Error(`could not read module source for ${file}`))
+        return
+      }
+
+      resolve(data)
+    })
+  })
+}

package/src/rsbuild/start-router-plugin.ts

@@ -0,0 +1,86 @@
+import path from 'pathe'
+import { routesManifestPlugin } from '../start-router-plugin/generator-plugins/routes-manifest-plugin'
+import { prerenderRoutesPlugin } from '../start-router-plugin/generator-plugins/prerender-routes-plugin'
+import { buildRouteTreeFileFooterFromConfig } from '../start-router-plugin/route-tree-footer'
+import { RSBUILD_ENVIRONMENT_NAMES } from './planning'
+import type { RsbuildPluginAPI } from '@rsbuild/core'
+import type { GetConfigFn, TanStackStartCoreOptions } from '../types'
+import type { TanStackStartRsbuildInputConfig } from './schema'
+
+/**
+ * Registers the TanStack Router generator and code-splitter plugins
+ * as rspack plugins via `modifyRspackConfig`.
+ *
+ * The router-plugin package exports rspack-compatible unplugin wrappers:
+ * - TanStackRouterGeneratorRspack: file-based route generation
+ * - TanStackRouterCodeSplitterRspack: route code splitting
+ *
+ * These are dynamically imported to avoid hard dependency on router-plugin/rspack.
+ */
+export function registerRouterPlugins(
+  api: RsbuildPluginAPI,
+  opts: {
+    getConfig: GetConfigFn
+    corePluginOpts: TanStackStartCoreOptions
+    startPluginOpts: TanStackStartRsbuildInputConfig
+  },
+): void {
+  api.modifyRspackConfig(async (config, utils) => {
+    const envName = utils.environment.name
+    const { startConfig } = opts.getConfig()
+    const routerConfig = startConfig.router
+
+    // Generator only runs once — register for the client environment
+    if (envName === RSBUILD_ENVIRONMENT_NAMES.client) {
+      try {
+        const { TanStackRouterGeneratorRspack } =
+          await import('@tanstack/router-plugin/rspack')
+        const generatorPlugin = TanStackRouterGeneratorRspack({
+          ...routerConfig,
+          target: opts.corePluginOpts.framework,
+          routeTreeFileFooter: () => {
+            return buildRouteTreeFileFooterFromConfig({
+              generatedRouteTreePath: path.resolve(
+                routerConfig.generatedRouteTree,
+              ),
+              getConfig: opts.getConfig,
+              corePluginOpts: opts.corePluginOpts,
+            })
+          },
+          plugins: [
+            routesManifestPlugin(),
+            ...(opts.startPluginOpts?.prerender?.enabled === true
+              ? [prerenderRoutesPlugin()]
+              : []),
+          ],
+        })
+        utils.appendPlugins(generatorPlugin as any)
+      } catch {
+        // router-plugin/rspack not available — skip
+      }
+    }
+
+    if (
+      envName === RSBUILD_ENVIRONMENT_NAMES.client ||
+      envName === RSBUILD_ENVIRONMENT_NAMES.server
+    ) {
+      const isClient = envName === RSBUILD_ENVIRONMENT_NAMES.client
+      try {
+        const { TanStackRouterCodeSplitterRspack } =
+          await import('@tanstack/router-plugin/rspack')
+        const splitterPlugin = TanStackRouterCodeSplitterRspack({
+          ...routerConfig,
+          target: opts.corePluginOpts.framework,
+          codeSplittingOptions: {
+            ...routerConfig.codeSplittingOptions,
+            deleteNodes: isClient ? ['ssr', 'server', 'headers'] : undefined,
+            addHmr: isClient,
+          },
+        })
+        utils.appendPlugins(splitterPlugin as any)
+      } catch {
+        // router-plugin/rspack not available — skip
+      }
+    }
+  })
+}

package/src/rsbuild/swc-rsc.ts

@@ -0,0 +1,166 @@
+import { RSBUILD_RSC_LAYERS } from './planning'
+import type { ModifyRspackConfigFn, Rspack } from '@rsbuild/core'
+
+type RspackConfig = Parameters<ModifyRspackConfigFn>[0]
+type RspackRule = Rspack.RuleSetRule
+
+/**
+ * Walk the rspack config's module.rules and inject
+ * `rspackExperiments.reactServerComponents: true` into SWC loaders.
+ *
+ * Recurses into `oneOf` arrays because rsbuild nests the main SWC loader
+ * inside a `oneOf` rule (e.g. separate branches for asset/source vs
+ * javascript/auto). Without recursion, only the mimetype-based fallback
+ * SWC rule gets the flag, leaving most .js/.ts files without RSC
+ * directive detection.
+ */
+export function enableSwcReactServerComponents(
+  config: RspackConfig,
+  scope: 'all' | 'rsc-subtree',
+): void {
+  const isRspackRule = (
+    rule: NonNullable<RspackConfig['module']['rules']>[number],
+  ): rule is RspackRule => !!rule && rule !== '...'
+  const getRuleLoaders = (rule: RspackRule) => {
+    const { use } = rule
+    if (!use) {
+      return []
+    }
+
+    return typeof use === 'function' ? [] : Array.isArray(use) ? use : [use]
+  }
+  const getLoaderPath = (
+    loader: ReturnType<typeof getRuleLoaders>[number],
+  ): string | undefined => (typeof loader === 'string' ? loader : loader.loader)
+  const cloneLoader = (
+    loader: ReturnType<typeof getRuleLoaders>[number],
+  ): ReturnType<typeof getRuleLoaders>[number] => {
+    if (typeof loader === 'string') {
+      return loader
+    }
+
+    const options = loader.options
+    return {
+      ...loader,
+      ...(options && typeof options === 'object' && !Array.isArray(options)
+        ? {
+            options: {
+              ...options,
+              ...(options.rspackExperiments &&
+              typeof options.rspackExperiments === 'object' &&
+              !Array.isArray(options.rspackExperiments)
+                ? {
+                    rspackExperiments: {
+                      ...options.rspackExperiments,
+                    },
+                  }
+                : {}),
+            },
+          }
+        : {}),
+    }
+  }
+  const cloneRuleUse = (use: RspackRule['use']): RspackRule['use'] => {
+    if (!use || typeof use === 'function') {
+      return use
+    }
+
+    if (Array.isArray(use)) {
+      return use.map((loader) => cloneLoader(loader)) as RspackRule['use']
+    }
+
+    return cloneLoader(use) as RspackRule['use']
+  }
+  const cloneRspackRule = (rule: RspackRule): RspackRule => {
+    return {
+      ...rule,
+      use: cloneRuleUse(rule.use),
+      resolve: rule.resolve ? { ...rule.resolve } : rule.resolve,
+      oneOf: Array.isArray(rule.oneOf)
+        ? rule.oneOf.map((childRule) =>
+            isRspackRule(childRule) ? cloneRspackRule(childRule) : childRule,
+          )
+        : rule.oneOf,
+    } as unknown as RspackRule
+  }
+  const rootRules = (config.module.rules ??= []).filter(isRspackRule)
+
+  function processRules(rules = rootRules): void {
+    for (const rule of rules) {
+      processRules(
+        Array.isArray(rule.oneOf) ? rule.oneOf.filter(isRspackRule) : [],
+      )
+
+      const hasSwcLoader = getRuleLoaders(rule).some((loader) =>
+        Boolean(getLoaderPath(loader)?.includes('swc-loader')),
+      )
+      if (!hasSwcLoader) continue
+
+      const enableReactServerComponentsOnRule = (nextRule: RspackRule) => {
+        for (const loader of getRuleLoaders(nextRule)) {
+          if (typeof loader === 'string') {
+            continue
+          }
+
+          const loaderPath = getLoaderPath(loader)
+          if (!loaderPath || !loaderPath.includes('swc-loader')) {
+            continue
+          }
+
+          const options =
+            loader.options && typeof loader.options === 'object'
+              ? loader.options
+              : (loader.options = {})
+          const experiments =
+            options.rspackExperiments &&
+            typeof options.rspackExperiments === 'object'
+              ? options.rspackExperiments
+              : (options.rspackExperiments = {})
+          const current = experiments.reactServerComponents
+
+          experiments.reactServerComponents =
+            current === true || current == null
+              ? {}
+              : typeof current === 'object' &&
+                  current !== null &&
+                  !Array.isArray(current)
+                ? { ...current }
+                : {}
+        }
+      }
+
+      if (scope === 'all') {
+        enableReactServerComponentsOnRule(rule)
+        continue
+      }
+
+      const originalRule = cloneRspackRule(rule)
+      const providerRule = cloneRspackRule(originalRule)
+      providerRule.resourceQuery = /(?:^|[?&])tss-serverfn-split(?:&|$)/
+      enableReactServerComponentsOnRule(providerRule)
+
+      const routeSplitRule = cloneRspackRule(originalRule)
+      routeSplitRule.resourceQuery = /(?:^|[?&])tsr-split(?:=|&|$)/
+      const routeSplitConditionNames = originalRule.resolve?.conditionNames
+      routeSplitRule.resolve = {
+        ...originalRule.resolve,
+        conditionNames: Array.isArray(routeSplitConditionNames)
+          ? routeSplitConditionNames.includes('...')
+            ? [...routeSplitConditionNames]
+            : ['...', ...routeSplitConditionNames]
+          : ['...'],
+      }
+
+      const subtreeRule = cloneRspackRule(originalRule)
+      subtreeRule.issuerLayer = RSBUILD_RSC_LAYERS.rsc
+      enableReactServerComponentsOnRule(subtreeRule)
+
+      for (const key of Object.keys(rule) as Array<keyof RspackRule>) {
+        delete rule[key]
+      }
+      rule.oneOf = [providerRule, routeSplitRule, subtreeRule, originalRule]
+    }
+  }
+
+  processRules()
+}

package/src/rsbuild/types.ts

@@ -0,0 +1,20 @@
+import type { EnvironmentConfig } from '@rsbuild/core'
+import type { TanStackStartCoreOptions } from '../types'
+
+export interface RsbuildEnvironmentOverrides {
+  all?: EnvironmentConfig | undefined
+  client?: EnvironmentConfig | undefined
+  server?: EnvironmentConfig | undefined
+  provider?: EnvironmentConfig | undefined
+}
+
+export interface RsbuildCoreOptions {
+  environments?: RsbuildEnvironmentOverrides | undefined
+}
+
+export type TanStackStartRsbuildPluginCoreOptions = TanStackStartCoreOptions & {
+  providerEnvironmentName: string
+  ssrIsProvider: boolean
+  rsbuild?: RsbuildCoreOptions | undefined
+  rsc?: boolean | undefined
+}