Skip to content

fix: strip invariant and warning strings from prod bundles#7007

Merged
Sheraff merged 4 commits intomainfrom
opencode/cosmic-otter
Mar 22, 2026
Merged

fix: strip invariant and warning strings from prod bundles#7007
Sheraff merged 4 commits intomainfrom
opencode/cosmic-otter

Conversation

@Sheraff
Copy link
Contributor

@Sheraff Sheraff commented Mar 21, 2026

Summary

  • export a shared invariant() helper from @tanstack/router-core and replace tiny-invariant across the repo with dev-only detailed errors plus a generic production throw
  • replace tiny-warning usages with dev-only console.warn(...) guards so warning strings disappear from production bundles
  • remove the tiny-invariant and tiny-warning dependencies, update the lockfile, and replace example/test-only assertions with local helpers or direct checks

Benchmark

  • React bundle deltas vs current main baseline from @benchmarks/bundle-size:
    • react-router.minimal: -889 raw / -401 gzip / -355 brotli
    • react-router.full: -889 raw / -415 gzip / -306 brotli
    • react-start.minimal: -1204 raw / -555 gzip / -349 brotli
    • react-start.full: -1202 raw / -506 gzip / -440 brotli

Testing

  • CI=1 NX_DAEMON=false pnpm nx affected --target=test:eslint --exclude=examples/**,e2e/** --outputStyle=stream --skipRemoteCache
  • CI=1 NX_DAEMON=false pnpm nx affected --target=test:types --exclude=examples/** --outputStyle=stream --skipRemoteCache
  • CI=1 NX_DAEMON=false pnpm nx affected --target=test:unit --exclude=examples/**,e2e/** --outputStyle=stream --skipRemoteCache
  • CI=1 NX_DAEMON=false pnpm nx run @benchmarks/bundle-size:build --outputStyle=stream --skipRemoteCache --skipNxCache

Summary by CodeRabbit

  • Chores

    • Removed several external assertion and warning libraries from examples and packages; manifests updated accordingly.
    • Added local/internal invariant utilities used across examples and core packages.
  • Refactor

    • Replaced third-party assertions/warnings with internal invariant helpers and direct console warnings.
    • Error reporting is environment-aware: detailed messages in non-production, minimal checks in production.

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Mar 21, 2026

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 15610bb7-f3ae-4af7-acbb-1729558c3d4e

📥 Commits

Reviewing files that changed from the base of the PR and between 7080e29 and ab84127.

📒 Files selected for processing (1)
  • .changeset/light-coins-hear.md
✅ Files skipped from review due to trivial changes (1)
  • .changeset/light-coins-hear.md

📝 Walkthrough

Walkthrough

Replaced external tiny-invariant/tiny-warning with local or exported invariant utilities and console.warn calls across examples and packages; added local invariant implementations; many unconditional invariants converted to env-gated throws (detailed Error in non-production, bare invariant() in production).

Changes

Cohort / File(s) Summary
Package Manifests
examples/react/start-convex-trellaux/package.json, examples/react/start-trellaux/package.json, packages/react-router/package.json, packages/react-start-client/package.json, packages/router-core/package.json, packages/router-devtools-core/package.json, packages/solid-router/package.json, packages/solid-start-client/package.json, packages/start-client-core/package.json, packages/start-server-core/package.json, packages/vue-router/package.json, packages/vue-start-client/package.json
Removed tiny-invariant and/or tiny-warning from dependencies.
New/Exported Invariants
packages/router-core/src/invariant.ts, packages/router-core/src/index.ts, examples/react/.../src/invariant.ts, examples/react/.../convex/invariant.ts
Added local invariant implementations and re-exported invariant from router-core.
Examples — React (start-trellaux / start-convex-trellaux)
examples/react/start-trellaux/src/invariant.ts, examples/react/start-trellaux/src/components/..., examples/react/start-convex-trellaux/src/invariant.ts, examples/react/start-convex-trellaux/convex/board.ts, examples/react/start-convex-trellaux/src/components/...
Switched imports to local invariant modules; call sites unchanged.
Router Core — logic & SSR
packages/router-core/src/load-matches.ts, packages/router-core/src/new-process-route-tree.ts, packages/router-core/src/route.ts, packages/router-core/src/ssr/ssr-client.ts, packages/router-core/src/ssr/ssr-server.ts
Replaced tiny-invariant with local invariant; many invariant checks now env-gated (throw detailed Error in non-prod, call invariant() in prod).
React Router — runtime & hooks
packages/react-router/src/Match.tsx, packages/react-router/src/Matches.tsx, packages/react-router/src/fileRoute.ts, packages/react-router/src/renderRouteNotFound.tsx, packages/react-router/src/useMatch.tsx, packages/react-router/src/useRouter.tsx
Replaced tiny-invariant/tiny-warning with @tanstack/router-core invariant and console.warn; added env-gated explicit Error throws for detailed messages.
React Router Tests
packages/react-router/tests/redirect.test.tsx
Replaced runtime invariant(...) assertions with TypeScript non-null (!) assertions and adjusted variable usage.
Start / Client Core
packages/react-start-client/src/renderRSC.tsx, packages/start-client-core/src/client-rpc/serverFnFetcher.ts
Switched to @tanstack/router-core invariant; replaced unconditional invariant calls with env-gated throws or invariant() fallback.
Start Server Core
packages/start-server-core/src/server-functions-handler.ts
Switched to @tanstack/router-core invariant; applied env-gated error handling for FormData/GET validation.
Router Devtools
packages/router-devtools-core/src/BaseTanStackRouterDevtoolsPanel.tsx
Removed unconditional runtime invariant(router, ...) check and related import.
Solid Router
packages/solid-router/src/Match.tsx, packages/solid-router/src/Matches.tsx, packages/solid-router/src/fileRoute.ts, packages/solid-router/src/renderRouteNotFound.tsx, packages/solid-router/src/useMatch.tsx, packages/solid-router/src/useRouter.tsx
Replaced tiny-invariant/tiny-warning with @tanstack/router-core invariant and console.warn; updated invariant failure control flow to be env-gated.
Solid Router Tests
packages/solid-router/tests/redirect.test.tsx
Replaced runtime invariant(...) assertions with TypeScript non-null (!) assertions and adjusted reads.
Vue Router
packages/vue-router/src/Match.tsx, packages/vue-router/src/Matches.tsx, packages/vue-router/src/fileRoute.ts, packages/vue-router/src/renderRouteNotFound.tsx, packages/vue-router/src/useMatch.tsx, packages/vue-router/src/useRouter.tsx
Replaced tiny-invariant/tiny-warning with @tanstack/router-core invariant and console.warn; adjusted invariant failure handling to be env-gated.
Vue Router Tests
packages/vue-router/tests/redirect.test.tsx
Replaced runtime invariant(...) assertions with TypeScript non-null (!) assertions and updated test reads.
Changeset
.changeset/light-coins-hear.md
Added changeset noting replacement of tiny-* packages with in-house invariant/warning handling.

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~75 minutes

Poem

🐰 I hopped through code and nudged the tiny checks away,

Local truths now stand where tiny packages used to stay.
In dev we shout the message, in prod we gently hush,
A rabbit’s tidy pruning — fewer deps, less rush. 🥕

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 36.36% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (2 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title 'fix: strip invariant and warning strings from prod bundles' clearly describes the main objective: removing invariant and warning strings from production bundles by replacing tiny-invariant and tiny-warning dependencies.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch opencode/cosmic-otter

Comment @coderabbitai help to get the list of available commands and usage tips.

@nx-cloud
Copy link

nx-cloud bot commented Mar 21, 2026

View your CI Pipeline Execution ↗ for commit ab84127

Command Status Duration Result
nx affected --targets=test:eslint,test:unit,tes... ✅ Succeeded 43s View ↗
nx run-many --target=build --exclude=examples/*... ✅ Succeeded 3s View ↗

☁️ Nx Cloud last updated this comment at 2026-03-22 07:47:38 UTC

@github-actions
Copy link
Contributor

github-actions bot commented Mar 21, 2026

🚀 Changeset Version Preview

10 package(s) bumped directly, 17 bumped as dependents.

🟩 Patch bumps

Package Version Reason
@tanstack/react-router 1.168.1 → 1.168.2 Changeset
@tanstack/react-start-client 1.166.16 → 1.166.17 Changeset
@tanstack/router-core 1.168.1 → 1.168.2 Changeset
@tanstack/router-devtools-core 1.167.0 → 1.167.1 Changeset
@tanstack/solid-router 1.168.1 → 1.168.2 Changeset
@tanstack/solid-start-client 1.166.15 → 1.166.16 Changeset
@tanstack/start-client-core 1.167.1 → 1.167.2 Changeset
@tanstack/start-server-core 1.167.1 → 1.167.2 Changeset
@tanstack/vue-router 1.168.1 → 1.168.2 Changeset
@tanstack/vue-start-client 1.166.15 → 1.166.16 Changeset
@tanstack/react-router-devtools 1.166.10 → 1.166.11 Dependent
@tanstack/react-start 1.167.2 → 1.167.3 Dependent
@tanstack/react-start-server 1.166.16 → 1.166.17 Dependent
@tanstack/router-cli 1.166.16 → 1.166.17 Dependent
@tanstack/router-devtools 1.166.10 → 1.166.11 Dependent
@tanstack/router-generator 1.166.15 → 1.166.16 Dependent
@tanstack/router-plugin 1.167.2 → 1.167.3 Dependent
@tanstack/router-vite-plugin 1.166.17 → 1.166.18 Dependent
@tanstack/solid-router-devtools 1.166.10 → 1.166.11 Dependent
@tanstack/solid-start 1.167.2 → 1.167.3 Dependent
@tanstack/solid-start-server 1.166.15 → 1.166.16 Dependent
@tanstack/start-plugin-core 1.167.5 → 1.167.6 Dependent
@tanstack/start-static-server-functions 1.166.17 → 1.166.18 Dependent
@tanstack/start-storage-context 1.166.15 → 1.166.16 Dependent
@tanstack/vue-router-devtools 1.166.10 → 1.166.11 Dependent
@tanstack/vue-start 1.167.2 → 1.167.3 Dependent
@tanstack/vue-start-server 1.166.15 → 1.166.16 Dependent

@github-actions
Copy link
Contributor

github-actions bot commented Mar 21, 2026

Bundle Size Benchmarks

  • Commit: d7445e048d7d
  • Measured at: 2026-03-22T07:47:50.717Z
  • Baseline source: history:d7445e048d7d
  • Dashboard: bundle-size history
Scenario Current (gzip) Delta vs baseline Raw Brotli Trend
react-router.minimal 88.15 KiB -401 B (-0.44%) 278.36 KiB 76.56 KiB ▁▁▁▁▁██████▅
react-router.full 91.31 KiB -415 B (-0.44%) 289.09 KiB 79.22 KiB ▁▁▁▁▁██████▅
solid-router.minimal 35.80 KiB -339 B (-0.92%) 108.26 KiB 32.08 KiB █████▃▃▃▃▃▃▁
solid-router.full 40.15 KiB -350 B (-0.84%) 121.40 KiB 35.93 KiB █████▃▃▃▃▃▃▁
vue-router.minimal 53.78 KiB -343 B (-0.62%) 154.49 KiB 48.23 KiB ▁▁▁▁▁██████▆
vue-router.full 58.55 KiB -346 B (-0.57%) 169.64 KiB 52.31 KiB ▁▁▁▁▁██████▆
react-start.minimal 102.44 KiB -555 B (-0.53%) 326.12 KiB 88.61 KiB ▁▁▁▁▁██████▄
react-start.full 105.86 KiB -506 B (-0.46%) 336.43 KiB 91.48 KiB ▁▁▁▁▁██████▅
solid-start.minimal 49.87 KiB -464 B (-0.90%) 154.45 KiB 43.93 KiB █████▃▃▃▃▃▃▁
solid-start.full 55.26 KiB -489 B (-0.86%) 170.28 KiB 48.53 KiB █████▄▄▄▄▄▄▁

Trend sparkline is historical gzip bytes ending with this PR measurement; lower is better.

Copy link

@chatgpt-codex-connector chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: c64c1d5f7d

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

@pkg-pr-new
Copy link

pkg-pr-new bot commented Mar 21, 2026

More templates

@tanstack/arktype-adapter

npm i https://pkg.pr.new/@tanstack/arktype-adapter@7007

@tanstack/eslint-plugin-router

npm i https://pkg.pr.new/@tanstack/eslint-plugin-router@7007

@tanstack/history

npm i https://pkg.pr.new/@tanstack/history@7007

@tanstack/nitro-v2-vite-plugin

npm i https://pkg.pr.new/@tanstack/nitro-v2-vite-plugin@7007

@tanstack/react-router

npm i https://pkg.pr.new/@tanstack/react-router@7007

@tanstack/react-router-devtools

npm i https://pkg.pr.new/@tanstack/react-router-devtools@7007

@tanstack/react-router-ssr-query

npm i https://pkg.pr.new/@tanstack/react-router-ssr-query@7007

@tanstack/react-start

npm i https://pkg.pr.new/@tanstack/react-start@7007

@tanstack/react-start-client

npm i https://pkg.pr.new/@tanstack/react-start-client@7007

@tanstack/react-start-server

npm i https://pkg.pr.new/@tanstack/react-start-server@7007

@tanstack/router-cli

npm i https://pkg.pr.new/@tanstack/router-cli@7007

@tanstack/router-core

npm i https://pkg.pr.new/@tanstack/router-core@7007

@tanstack/router-devtools

npm i https://pkg.pr.new/@tanstack/router-devtools@7007

@tanstack/router-devtools-core

npm i https://pkg.pr.new/@tanstack/router-devtools-core@7007

@tanstack/router-generator

npm i https://pkg.pr.new/@tanstack/router-generator@7007

@tanstack/router-plugin

npm i https://pkg.pr.new/@tanstack/router-plugin@7007

@tanstack/router-ssr-query-core

npm i https://pkg.pr.new/@tanstack/router-ssr-query-core@7007

@tanstack/router-utils

npm i https://pkg.pr.new/@tanstack/router-utils@7007

@tanstack/router-vite-plugin

npm i https://pkg.pr.new/@tanstack/router-vite-plugin@7007

@tanstack/solid-router

npm i https://pkg.pr.new/@tanstack/solid-router@7007

@tanstack/solid-router-devtools

npm i https://pkg.pr.new/@tanstack/solid-router-devtools@7007

@tanstack/solid-router-ssr-query

npm i https://pkg.pr.new/@tanstack/solid-router-ssr-query@7007

@tanstack/solid-start

npm i https://pkg.pr.new/@tanstack/solid-start@7007

@tanstack/solid-start-client

npm i https://pkg.pr.new/@tanstack/solid-start-client@7007

@tanstack/solid-start-server

npm i https://pkg.pr.new/@tanstack/solid-start-server@7007

@tanstack/start-client-core

npm i https://pkg.pr.new/@tanstack/start-client-core@7007

@tanstack/start-fn-stubs

npm i https://pkg.pr.new/@tanstack/start-fn-stubs@7007

@tanstack/start-plugin-core

npm i https://pkg.pr.new/@tanstack/start-plugin-core@7007

@tanstack/start-server-core

npm i https://pkg.pr.new/@tanstack/start-server-core@7007

@tanstack/start-static-server-functions

npm i https://pkg.pr.new/@tanstack/start-static-server-functions@7007

@tanstack/start-storage-context

npm i https://pkg.pr.new/@tanstack/start-storage-context@7007

@tanstack/valibot-adapter

npm i https://pkg.pr.new/@tanstack/valibot-adapter@7007

@tanstack/virtual-file-routes

npm i https://pkg.pr.new/@tanstack/virtual-file-routes@7007

@tanstack/vue-router

npm i https://pkg.pr.new/@tanstack/vue-router@7007

@tanstack/vue-router-devtools

npm i https://pkg.pr.new/@tanstack/vue-router-devtools@7007

@tanstack/vue-router-ssr-query

npm i https://pkg.pr.new/@tanstack/vue-router-ssr-query@7007

@tanstack/vue-start

npm i https://pkg.pr.new/@tanstack/vue-start@7007

@tanstack/vue-start-client

npm i https://pkg.pr.new/@tanstack/vue-start-client@7007

@tanstack/vue-start-server

npm i https://pkg.pr.new/@tanstack/vue-start-server@7007

@tanstack/zod-adapter

npm i https://pkg.pr.new/@tanstack/zod-adapter@7007

commit: ab84127

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (3)
examples/react/start-trellaux/src/components/Column.tsx (1)

51-51: ⚠️ Potential issue | 🔴 Critical

Missing message argument.

This call will fail TypeScript compilation since message is required in the current invariant signature. Once invariant.ts is fixed to make message optional, this will work correctly.

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@examples/react/start-trellaux/src/components/Column.tsx` at line 51, The call
to invariant in Column.tsx is missing the required message argument and will
fail TypeScript; update the invariant call that checks listRef.current
(reference: invariant and listRef.current in Column.tsx) to include a short
descriptive string message as the second argument (e.g., indicating that
listRef.current is null/unavailable) so it matches the invariant signature.
examples/react/start-trellaux/src/components/NewCard.tsx (1)

36-36: ⚠️ Potential issue | 🔴 Critical

Missing message argument.

This call will fail TypeScript compilation since message is required in the current invariant signature. Once invariant.ts is fixed to make message optional, this will work correctly.

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@examples/react/start-trellaux/src/components/NewCard.tsx` at line 36, The
invariant call in NewCard.tsx (involving invariant and textAreaRef.current)
lacks the required message argument and will fail TypeScript compilation; update
the call to pass a descriptive error message (e.g., indicating
textAreaRef.current is null/unavailable) so invariant(textAreaRef.current,
"<your message>") satisfies the current signature, or alternatively use a
non-null assertion at the usage site after the invariant check if appropriate.
examples/react/start-convex-trellaux/src/components/NewCard.tsx (1)

36-36: ⚠️ Potential issue | 🔴 Critical

Missing required message argument will cause TypeScript error.

The local invariant function signature requires two arguments: (value: unknown, message: string). This call passes only one argument.

Proposed fix
-        invariant(textAreaRef.current)
+        invariant(textAreaRef.current, 'expected textArea ref')
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@examples/react/start-convex-trellaux/src/components/NewCard.tsx` at line 36,
The call to invariant in NewCard.tsx uses only one argument
(invariant(textAreaRef.current)) but the function signature requires (value:
unknown, message: string); update the call inside the NewCard component to pass
a descriptive message as the second argument (e.g., "textAreaRef.current is
null") so TypeScript errors are resolved and the runtime assertion provides
context; locate the invariant call by name (invariant) in NewCard.tsx and add
the message string as the second parameter.
🧹 Nitpick comments (9)
examples/react/start-convex-trellaux/src/components/Column.tsx (1)

2-2: Import order violation flagged by ESLint.

The ../invariant import should be placed after external package imports (react-dom, tailwind-merge) to comply with the project's import ordering rules.

Suggested fix
 import { forwardRef, useCallback, useMemo, useRef, useState } from 'react'
-import { invariant } from '../invariant'
 import { twMerge } from 'tailwind-merge'
 
 import { flushSync } from 'react-dom'
+import { invariant } from '../invariant'
 import { CONTENT_TYPES } from '../types'
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@examples/react/start-convex-trellaux/src/components/Column.tsx` at line 2,
The ESLint import-order error is caused by placing the local import "invariant"
before external package imports; update the import order in Column.tsx so that
external modules (e.g., "react-dom" and "tailwind-merge") come first and then
import the local module "../invariant" after them, ensuring imports are grouped
as [external packages] then [local/internal] to satisfy the project's import
ordering rules.
examples/react/start-convex-trellaux/src/components/Board.tsx (1)

2-2: Import order violation flagged by ESLint.

The ../invariant import should be placed after external package imports to comply with the project's import ordering rules.

Suggested fix
 import { useCallback, useMemo, useRef } from 'react'
-import { invariant } from '../invariant'
 import { useSuspenseQuery } from '@tanstack/react-query'
 import { convexQuery } from '@convex-dev/react-query'
 import { api } from '../../convex/_generated/api.js'
+import { invariant } from '../invariant'
 import { useUpdateBoardMutation } from '../queries.js'
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@examples/react/start-convex-trellaux/src/components/Board.tsx` at line 2, In
Board.tsx the local import "import { invariant } from '../invariant'" is placed
before external package imports and violates ESLint import-order; move the
invariant import so that all external package imports (React, other npm
packages) appear first and then place the local relative import of invariant
after them, ensuring import { invariant } from '../invariant' is relocated below
the external imports to satisfy the project's ordering rules.
packages/solid-router/src/renderRouteNotFound.tsx (1)

22-27: Remove redundant nested condition around console.warn.

Inside this branch, route.options.notFoundComponent is already known to be missing, so the extra inner if adds noise only.

♻️ Suggested cleanup
-    if (process.env.NODE_ENV !== 'production') {
-      if (!route.options.notFoundComponent) {
-        console.warn(
-          `Warning: A notFoundError was encountered on the route with ID "${route.id}", but a notFoundComponent option was not configured, nor was a router level defaultNotFoundComponent configured. Consider configuring at least one of these to avoid TanStack Router's overly generic defaultNotFoundComponent (<p>Not Found</p>)`,
-        )
-      }
-    }
+    if (process.env.NODE_ENV !== 'production') {
+      console.warn(
+        `Warning: A notFoundError was encountered on the route with ID "${route.id}", but a notFoundComponent option was not configured, nor was a router level defaultNotFoundComponent configured. Consider configuring at least one of these to avoid TanStack Router's overly generic defaultNotFoundComponent (<p>Not Found</p>)`,
+      )
+    }
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/solid-router/src/renderRouteNotFound.tsx` around lines 22 - 27, The
nested check around console.warn is redundant; inside the renderRouteNotFound
flow where process.env.NODE_ENV !== 'production' you already know you should
warn when route.options.notFoundComponent is missing, so remove the inner if and
directly emit the warning. Locate the block using process.env.NODE_ENV !==
'production' and the route.options.notFoundComponent reference (and the
console.warn call) and replace the nested if/console.warn with a single
conditional or inline console.warn guarded by the existing NODE_ENV check,
keeping the same warning text and referencing route.id.
packages/vue-router/src/renderRouteNotFound.tsx (1)

23-28: Redundant notFoundComponent re-check can be removed.

The outer guard already guarantees this condition, so simplifying this block improves readability without changing behavior.

♻️ Suggested cleanup
-    if (process.env.NODE_ENV !== 'production') {
-      if (!route.options.notFoundComponent) {
-        console.warn(
-          `Warning: A notFoundError was encountered on the route with ID "${route.id}", but a notFoundComponent option was not configured, nor was a router level defaultNotFoundComponent configured. Consider configuring at least one of these to avoid TanStack Router's overly generic defaultNotFoundComponent (<p>Not Found</p>)`,
-        )
-      }
-    }
+    if (process.env.NODE_ENV !== 'production') {
+      console.warn(
+        `Warning: A notFoundError was encountered on the route with ID "${route.id}", but a notFoundComponent option was not configured, nor was a router level defaultNotFoundComponent configured. Consider configuring at least one of these to avoid TanStack Router's overly generic defaultNotFoundComponent (<p>Not Found</p>)`,
+      )
+    }
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/vue-router/src/renderRouteNotFound.tsx` around lines 23 - 28, Remove
the redundant inner check for route.options.notFoundComponent inside the
development-only block in renderRouteNotFound.tsx: the outer guard already
ensures notFoundComponent is falsey, so delete the if
(!route.options.notFoundComponent) wrapper and call console.warn(...) directly;
reference the existing route.options.notFoundComponent and the development guard
(process.env.NODE_ENV !== 'production') when making the change to keep behavior
identical and improve readability.
packages/router-devtools-core/src/BaseTanStackRouterDevtoolsPanel.tsx (1)

2-3: Consolidate duplicate imports from @tanstack/router-core.

The ESLint import/no-duplicates rule correctly flags that @tanstack/router-core is imported twice. Merge these into a single import statement.

♻️ Proposed fix
-import { invariant } from '@tanstack/router-core'
-import { interpolatePath, rootRouteId, trimPath } from '@tanstack/router-core'
+import { invariant, interpolatePath, rootRouteId, trimPath } from '@tanstack/router-core'
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/router-devtools-core/src/BaseTanStackRouterDevtoolsPanel.tsx` around
lines 2 - 3, Consolidate the duplicate imports by combining both import
statements from '@tanstack/router-core' into a single import that lists
invariant, interpolatePath, rootRouteId, and trimPath together; update the top
of BaseTanStackRouterDevtoolsPanel.tsx to import these symbols in one line to
satisfy the import/no-duplicates ESLint rule.
packages/react-router/src/renderRouteNotFound.tsx (1)

23-29: Redundant condition check.

The inner if (!route.options.notFoundComponent) check on line 24 is redundant since we're already inside the outer if (!route.options.notFoundComponent) block (line 18). This was likely carried over from the previous warning(false, ...) pattern.

♻️ Suggested simplification
     if (process.env.NODE_ENV !== 'production') {
-      if (!route.options.notFoundComponent) {
-        console.warn(
-          `Warning: A notFoundError was encountered on the route with ID "${route.id}", but a notFoundComponent option was not configured, nor was a router level defaultNotFoundComponent configured. Consider configuring at least one of these to avoid TanStack Router's overly generic defaultNotFoundComponent (<p>Not Found</p>)`,
-        )
-      }
+      console.warn(
+        `Warning: A notFoundError was encountered on the route with ID "${route.id}", but a notFoundComponent option was not configured, nor was a router level defaultNotFoundComponent configured. Consider configuring at least one of these to avoid TanStack Router's overly generic defaultNotFoundComponent (<p>Not Found</p>)`,
+      )
     }
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/react-router/src/renderRouteNotFound.tsx` around lines 23 - 29, The
code in renderRouteNotFound contains a redundant nested check for
route.options.notFoundComponent: inside the outer if that already verifies
!route.options.notFoundComponent you should remove the inner if and directly
call console.warn when process.env.NODE_ENV !== 'production' and the
route.options.notFoundComponent is falsy; update the block around
renderRouteNotFound/route/options.notFoundComponent to eliminate the duplicate
condition and leave a single console.warn invocation.
packages/start-server-core/src/server-functions-handler.ts (1)

1-6: Consolidate duplicate imports from @tanstack/router-core.

ESLint correctly flags that @tanstack/router-core is imported twice. Merge the imports into a single statement for cleaner code.

♻️ Proposed fix
 import {
   createRawStreamRPCPlugin,
+  invariant,
   isNotFound,
   isRedirect,
 } from '@tanstack/router-core'
-import { invariant } from '@tanstack/router-core'
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/start-server-core/src/server-functions-handler.ts` around lines 1 -
6, Merge the duplicate imports from `@tanstack/router-core` into a single import
statement: combine createRawStreamRPCPlugin, isNotFound, isRedirect and
invariant into one consolidated import (referencing the symbols
createRawStreamRPCPlugin, isNotFound, isRedirect, invariant) and remove the
second import line so there is only one import from `@tanstack/router-core`.
packages/start-client-core/src/client-rpc/serverFnFetcher.ts (1)

1-8: Consolidate duplicate imports from @tanstack/router-core.

ESLint correctly flags that @tanstack/router-core is imported twice. Merge the imports into a single statement.

♻️ Proposed fix
 import {
   createRawStreamDeserializePlugin,
   encode,
+  invariant,
   isNotFound,
   parseRedirect,
 } from '@tanstack/router-core'
 import { fromCrossJSON, toJSONAsync } from 'seroval'
-import { invariant } from '@tanstack/router-core'
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/start-client-core/src/client-rpc/serverFnFetcher.ts` around lines 1
- 8, The file currently imports from '@tanstack/router-core' twice; consolidate
into one import by merging the two import lists so symbols
createRawStreamDeserializePlugin, encode, isNotFound, parseRedirect, and
invariant are imported from a single import statement; update the top-of-file
imports accordingly to remove the duplicate import and keep all referenced
symbols in that single import.
packages/react-router/src/Match.tsx (1)

174-176: Include the caught error in the dev warning.

Switching from tiny-warning to bare console.warn drops the useful context you used to get when this path fired. Logging error (and optionally errorInfo) keeps production clean but makes dev failures much easier to act on.

♻️ Suggested tweak
               if (process.env.NODE_ENV !== 'production') {
-                console.warn(`Warning: Error in route match: ${matchId}`)
+                console.warn(
+                  `Warning: Error in route match: ${matchId}`,
+                  error,
+                  errorInfo,
+                )
               }
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/react-router/src/Match.tsx` around lines 174 - 176, The dev-only
warning drops useful context; update the warning inside the error-handling
branch where process.env.NODE_ENV !== 'production' (the block that currently
does console.warn(`Warning: Error in route match: ${matchId}`)) to include the
caught error (and errorInfo if available) in the console.warn call so developers
see full details — e.g., change the message to include the error object and
optional errorInfo alongside matchId and ensure you reference the caught
variables from the surrounding catch handler that encloses matchId.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@examples/react/start-trellaux/src/components/Column.tsx`:
- Line 2: Import order violation: move the named import "invariant" from
'../invariant' so it appears after the existing 'react-dom' import (the import
on line 5) to satisfy the ESLint import-order rule; update the import block in
Column.tsx by reordering the imports accordingly and re-run the linter to
confirm the error is resolved.

In `@examples/react/start-trellaux/src/invariant.ts`:
- Around line 1-5: The invariant function requires a message but some call sites
(e.g., Column.tsx and NewCard.tsx) call invariant(value) without it; update the
invariant function signature to make the message optional (message?: string) and
when throwing use a fallback like 'Invariant failed' (or include
String(message)) so the function still throws a meaningful error while
preserving the asserts value return type; update the export function
invariant(...) accordingly so existing call sites compile without changes.

---

Outside diff comments:
In `@examples/react/start-convex-trellaux/src/components/NewCard.tsx`:
- Line 36: The call to invariant in NewCard.tsx uses only one argument
(invariant(textAreaRef.current)) but the function signature requires (value:
unknown, message: string); update the call inside the NewCard component to pass
a descriptive message as the second argument (e.g., "textAreaRef.current is
null") so TypeScript errors are resolved and the runtime assertion provides
context; locate the invariant call by name (invariant) in NewCard.tsx and add
the message string as the second parameter.

In `@examples/react/start-trellaux/src/components/Column.tsx`:
- Line 51: The call to invariant in Column.tsx is missing the required message
argument and will fail TypeScript; update the invariant call that checks
listRef.current (reference: invariant and listRef.current in Column.tsx) to
include a short descriptive string message as the second argument (e.g.,
indicating that listRef.current is null/unavailable) so it matches the invariant
signature.

In `@examples/react/start-trellaux/src/components/NewCard.tsx`:
- Line 36: The invariant call in NewCard.tsx (involving invariant and
textAreaRef.current) lacks the required message argument and will fail
TypeScript compilation; update the call to pass a descriptive error message
(e.g., indicating textAreaRef.current is null/unavailable) so
invariant(textAreaRef.current, "<your message>") satisfies the current
signature, or alternatively use a non-null assertion at the usage site after the
invariant check if appropriate.

---

Nitpick comments:
In `@examples/react/start-convex-trellaux/src/components/Board.tsx`:
- Line 2: In Board.tsx the local import "import { invariant } from
'../invariant'" is placed before external package imports and violates ESLint
import-order; move the invariant import so that all external package imports
(React, other npm packages) appear first and then place the local relative
import of invariant after them, ensuring import { invariant } from
'../invariant' is relocated below the external imports to satisfy the project's
ordering rules.

In `@examples/react/start-convex-trellaux/src/components/Column.tsx`:
- Line 2: The ESLint import-order error is caused by placing the local import
"invariant" before external package imports; update the import order in
Column.tsx so that external modules (e.g., "react-dom" and "tailwind-merge")
come first and then import the local module "../invariant" after them, ensuring
imports are grouped as [external packages] then [local/internal] to satisfy the
project's import ordering rules.

In `@packages/react-router/src/Match.tsx`:
- Around line 174-176: The dev-only warning drops useful context; update the
warning inside the error-handling branch where process.env.NODE_ENV !==
'production' (the block that currently does console.warn(`Warning: Error in
route match: ${matchId}`)) to include the caught error (and errorInfo if
available) in the console.warn call so developers see full details — e.g.,
change the message to include the error object and optional errorInfo alongside
matchId and ensure you reference the caught variables from the surrounding catch
handler that encloses matchId.

In `@packages/react-router/src/renderRouteNotFound.tsx`:
- Around line 23-29: The code in renderRouteNotFound contains a redundant nested
check for route.options.notFoundComponent: inside the outer if that already
verifies !route.options.notFoundComponent you should remove the inner if and
directly call console.warn when process.env.NODE_ENV !== 'production' and the
route.options.notFoundComponent is falsy; update the block around
renderRouteNotFound/route/options.notFoundComponent to eliminate the duplicate
condition and leave a single console.warn invocation.

In `@packages/router-devtools-core/src/BaseTanStackRouterDevtoolsPanel.tsx`:
- Around line 2-3: Consolidate the duplicate imports by combining both import
statements from '@tanstack/router-core' into a single import that lists
invariant, interpolatePath, rootRouteId, and trimPath together; update the top
of BaseTanStackRouterDevtoolsPanel.tsx to import these symbols in one line to
satisfy the import/no-duplicates ESLint rule.

In `@packages/solid-router/src/renderRouteNotFound.tsx`:
- Around line 22-27: The nested check around console.warn is redundant; inside
the renderRouteNotFound flow where process.env.NODE_ENV !== 'production' you
already know you should warn when route.options.notFoundComponent is missing, so
remove the inner if and directly emit the warning. Locate the block using
process.env.NODE_ENV !== 'production' and the route.options.notFoundComponent
reference (and the console.warn call) and replace the nested if/console.warn
with a single conditional or inline console.warn guarded by the existing
NODE_ENV check, keeping the same warning text and referencing route.id.

In `@packages/start-client-core/src/client-rpc/serverFnFetcher.ts`:
- Around line 1-8: The file currently imports from '@tanstack/router-core'
twice; consolidate into one import by merging the two import lists so symbols
createRawStreamDeserializePlugin, encode, isNotFound, parseRedirect, and
invariant are imported from a single import statement; update the top-of-file
imports accordingly to remove the duplicate import and keep all referenced
symbols in that single import.

In `@packages/start-server-core/src/server-functions-handler.ts`:
- Around line 1-6: Merge the duplicate imports from `@tanstack/router-core` into a
single import statement: combine createRawStreamRPCPlugin, isNotFound,
isRedirect and invariant into one consolidated import (referencing the symbols
createRawStreamRPCPlugin, isNotFound, isRedirect, invariant) and remove the
second import line so there is only one import from `@tanstack/router-core`.

In `@packages/vue-router/src/renderRouteNotFound.tsx`:
- Around line 23-28: Remove the redundant inner check for
route.options.notFoundComponent inside the development-only block in
renderRouteNotFound.tsx: the outer guard already ensures notFoundComponent is
falsey, so delete the if (!route.options.notFoundComponent) wrapper and call
console.warn(...) directly; reference the existing
route.options.notFoundComponent and the development guard (process.env.NODE_ENV
!== 'production') when making the change to keep behavior identical and improve
readability.

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 19faa4b5-fa00-4dbd-a537-e86414655b9f

📥 Commits

Reviewing files that changed from the base of the PR and between d7445e0 and c64c1d5.

⛔ Files ignored due to path filters (1)
  • pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
📒 Files selected for processing (59)
  • examples/react/start-convex-trellaux/convex/board.ts
  • examples/react/start-convex-trellaux/convex/invariant.ts
  • examples/react/start-convex-trellaux/package.json
  • examples/react/start-convex-trellaux/src/components/Board.tsx
  • examples/react/start-convex-trellaux/src/components/Card.tsx
  • examples/react/start-convex-trellaux/src/components/Column.tsx
  • examples/react/start-convex-trellaux/src/components/NewCard.tsx
  • examples/react/start-convex-trellaux/src/components/NewColumn.tsx
  • examples/react/start-convex-trellaux/src/invariant.ts
  • examples/react/start-trellaux/package.json
  • examples/react/start-trellaux/src/components/Board.tsx
  • examples/react/start-trellaux/src/components/Card.tsx
  • examples/react/start-trellaux/src/components/Column.tsx
  • examples/react/start-trellaux/src/components/NewCard.tsx
  • examples/react/start-trellaux/src/components/NewColumn.tsx
  • examples/react/start-trellaux/src/db/board.ts
  • examples/react/start-trellaux/src/invariant.ts
  • packages/react-router/package.json
  • packages/react-router/src/Match.tsx
  • packages/react-router/src/Matches.tsx
  • packages/react-router/src/fileRoute.ts
  • packages/react-router/src/renderRouteNotFound.tsx
  • packages/react-router/src/useMatch.tsx
  • packages/react-router/src/useRouter.tsx
  • packages/react-router/tests/redirect.test.tsx
  • packages/react-start-client/package.json
  • packages/react-start-client/src/renderRSC.tsx
  • packages/router-core/package.json
  • packages/router-core/src/index.ts
  • packages/router-core/src/invariant.ts
  • packages/router-core/src/load-matches.ts
  • packages/router-core/src/new-process-route-tree.ts
  • packages/router-core/src/route.ts
  • packages/router-core/src/ssr/ssr-client.ts
  • packages/router-core/src/ssr/ssr-server.ts
  • packages/router-devtools-core/package.json
  • packages/router-devtools-core/src/BaseTanStackRouterDevtoolsPanel.tsx
  • packages/solid-router/package.json
  • packages/solid-router/src/Match.tsx
  • packages/solid-router/src/Matches.tsx
  • packages/solid-router/src/fileRoute.ts
  • packages/solid-router/src/renderRouteNotFound.tsx
  • packages/solid-router/src/useMatch.tsx
  • packages/solid-router/src/useRouter.tsx
  • packages/solid-router/tests/redirect.test.tsx
  • packages/solid-start-client/package.json
  • packages/start-client-core/package.json
  • packages/start-client-core/src/client-rpc/serverFnFetcher.ts
  • packages/start-server-core/package.json
  • packages/start-server-core/src/server-functions-handler.ts
  • packages/vue-router/package.json
  • packages/vue-router/src/Match.tsx
  • packages/vue-router/src/Matches.tsx
  • packages/vue-router/src/fileRoute.ts
  • packages/vue-router/src/renderRouteNotFound.tsx
  • packages/vue-router/src/useMatch.tsx
  • packages/vue-router/src/useRouter.tsx
  • packages/vue-router/tests/redirect.test.tsx
  • packages/vue-start-client/package.json
💤 Files with no reviewable changes (2)
  • examples/react/start-trellaux/package.json
  • examples/react/start-convex-trellaux/package.json

@codspeed-hq
Copy link

codspeed-hq bot commented Mar 21, 2026

Merging this PR will not alter performance

✅ 6 untouched benchmarks


Comparing opencode/cosmic-otter (ab84127) with main (d7445e0)

Open in CodSpeed

@Sheraff Sheraff merged commit c9e1855 into main Mar 22, 2026
17 checks passed
@Sheraff Sheraff deleted the opencode/cosmic-otter branch March 22, 2026 09:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants