fix(eslint-config): disable react-refresh/only-export-components for TanStack and unicorn/no-null for JSX/TSX

prisis · claude · prisis · commit 2d719a15e760 · 2026-02-26T10:29:42.000+01:00
- Detect TanStack Router/Start packages and disable `react-refresh/only-export-components` entirely, since route files export Route objects, loaders, and server functions by design
- Add per-route-file override in tanstack-router config as additional safety net
- Disable `unicorn/no-null` for .jsx and .tsx files — React uses null as a first-class value for rendering, DOM refs, and external APIs

Co-Authored-By: Claude Sonnet 4.6 &lt;noreply@anthropic.com&gt;
diff --git a/packages/eslint-config/src/config/plugins/react.ts b/packages/eslint-config/src/config/plugins/react.ts
@@ -25,6 +25,9 @@ const ReactRefreshAllowConstantExportPackages = ["vite"];
 const RemixPackages = ["@remix-run/node", "@remix-run/react", "@remix-run/serve", "@remix-run/dev"];
 const NextJsPackages = ["next"];
 const ReactRouterPackages = ["@react-router/node", "@react-router/react", "@react-router/serve", "@react-router/dev"];
+// TanStack Router/Start route files export Route objects and server functions — not just components.
+// react-refresh HMR rule does not apply to these patterns.
+const TanstackRouterPackages = ["@tanstack/react-router", "@tanstack/router", "@tanstack/start", "@tanstack/react-start"];
 
 type PluginReactCompiler = {
     configs: {
@@ -124,6 +127,7 @@ export default createConfig<
     const isUsingRemix = hasPackageJsonAnyDependency(packageJson, RemixPackages);
     const isUsingNext = hasPackageJsonAnyDependency(packageJson, NextJsPackages);
     const isUsingReactRouter = hasPackageJsonAnyDependency(packageJson, ReactRouterPackages);
+    const isUsingTanstack = hasPackageJsonAnyDependency(packageJson, TanstackRouterPackages);
 
     const { plugins } = pluginReactX.configs.all as {
         plugins: Record<string, unknown>;
@@ -297,34 +301,38 @@ export default createConfig<
                 "react-naming-convention/use-state": "error",
 
                 // react refresh
-                "react-refresh/only-export-components": [
-                    "error",
-                    {
-                        allowConstantExport: isAllowConstantExport,
-                        allowExportNames: [
-                            ...isUsingNext
-                                ? [
-                                    "dynamic",
-                                    "dynamicParams",
-                                    "revalidate",
-                                    "fetchCache",
-                                    "runtime",
-                                    "preferredRegion",
-                                    "maxDuration",
-                                    "config",
-                                    "generateStaticParams",
-                                    "metadata",
-                                    "generateMetadata",
-                                    "viewport",
-                                    "generateViewport",
-                                ]
-                                : [],
-                            ...isUsingRemix || isUsingReactRouter
-                                ? ["meta", "links", "headers", "loader", "action", "clientLoader", "clientAction", "handle", "shouldRevalidate"]
-                                : [],
-                        ],
-                    },
-                ],
+                // Disabled for TanStack Router/Start: route files export Route objects,
+                // loaders, server functions and other non-component values by design.
+                "react-refresh/only-export-components": isUsingTanstack
+                    ? "off"
+                    : [
+                        "error",
+                        {
+                            allowConstantExport: isAllowConstantExport,
+                            allowExportNames: [
+                                ...isUsingNext
+                                    ? [
+                                        "dynamic",
+                                        "dynamicParams",
+                                        "revalidate",
+                                        "fetchCache",
+                                        "runtime",
+                                        "preferredRegion",
+                                        "maxDuration",
+                                        "config",
+                                        "generateStaticParams",
+                                        "metadata",
+                                        "generateMetadata",
+                                        "viewport",
+                                        "generateViewport",
+                                    ]
+                                    : [],
+                                ...isUsingRemix || isUsingReactRouter
+                                    ? ["meta", "links", "headers", "loader", "action", "clientLoader", "clientAction", "handle", "shouldRevalidate"]
+                                    : [],
+                            ],
+                        },
+                    ],
 
                 // Prevents leaked addEventListener in a component or custom hook
                 // https://eslint-react.xyz/docs/rules/web-api-no-leaked-event-listener
@@ -1193,6 +1201,10 @@ export default createConfig<
                 // Prevent missing parentheses around multilines JSX
                 // https://github.com/jsx-eslint/eslint-plugin-react/blob/73abadb697034b5ccb514d79fb4689836fe61f91/docs/rules/no-typos.md
                 "react/no-typos": "error",
+
+                // React uses null as a first-class value: return null (render nothing),
+                // useRef<T>(null) (DOM refs), and external APIs/JSON all require null.
+                "unicorn/no-null": "off",
             },
             settings: {
                 extensions: [".jsx"],
@@ -1207,6 +1219,10 @@ export default createConfig<
                 "react/jsx-filename-extension": "off",
                 "react/prop-types": "off",
                 "react/require-default-props": "off",
+
+                // React uses null as a first-class value: return null (render nothing),
+                // useRef<T>(null) (DOM refs), and external APIs/JSON all require null.
+                "unicorn/no-null": "off",
             },
         },
         {
diff --git a/packages/eslint-config/src/config/plugins/tanstack-router.ts b/packages/eslint-config/src/config/plugins/tanstack-router.ts
@@ -23,6 +23,11 @@ export default createConfig<OptionsFiles & OptionsOverrides>("all", async (confi
             rules: {
                 // Tanstack Router uses a custom sort order for objects
                 "perfectionist/sort-objects": "off",
+
+                // TanStack Router route files export a `Route` object (createFileRoute result),
+                // loaders, and other non-component values — not just React components.
+                // Disabling avoids false positives from react-refresh HMR rule.
+                "react-refresh/only-export-components": "off",
             },
         },
     ];
