feat(eslint-plugin-router): add rule to ensure correct property order…

… for createXXXRoute functions (#2362)

docs/config.json

@@ -238,6 +238,19 @@
         }
       ]
     },
+    {
+      "label": "ESLint",
+      "children": [
+        {
+          "label": "ESLint Plugin Router",
+          "to": "eslint/eslint-plugin-router"
+        },
+        {
+          "label": "Create Route Property Order",
+          "to": "eslint/create-route-property-order"
+        }
+      ]
+    },
     {
       "label": "Router Examples",
       "children": [],

docs/eslint/create-route-property-order.md

@@ -0,0 +1,57 @@
+---
+id: create-route-property-order
+title: Ensure correct order of inference sensitive properties for createRoute functions
+---
+
+For the following functions, the property order of the passed in object matters due to type inference:
+
+- `createRoute`
+- `createFileRoute`
+- `createRootRoute`
+- `createRootRouteWithContext`
+
+The correct property order is as follows:
+
+- `params`
+- `validateSearch`
+- `context`
+- `beforeLoad`
+- `loaderDeps`
+- `loader`
+
+All other properties are insensitive to the order as they do not depend on type inference.
+
+## Rule Details
+
+Examples of **incorrect** code for this rule:
+
+```tsx
+/* eslint "@tanstack/router/create-route-property-order": "warn" */
+import { createFileRoute } from '@tanstack/react-router'
+
+export const Route = createFileRoute('/foo/bar/$id')({
+  loader: async ({context}) => {
+    await context.queryClient.ensureQueryData(getQueryOptions(context.hello)),
+  },
+  beforeLoad: () => ({hello: 'world'})
+})
+```
+
+Examples of **correct** code for this rule:
+
+```tsx
+/* eslint "@tanstack/router/create-route-property-order": "warn" */
+import { createFileRoute } from '@tanstack/react-router'
+
+export const Route = createFileRoute('/foo/bar/$id')({
+  beforeLoad: () => ({hello: 'world'}),
+  loader: async ({context}) => {
+    await context.queryClient.ensureQueryData(getQueryOptions(context.hello)),
+  }
+})
+```
+
+## Attributes
+
+- [x] ✅ Recommended
+- [x] 🔧 Fixable

docs/eslint/eslint-plugin-router.md

@@ -0,0 +1,96 @@
+---
+id: eslint-plugin-router
+title: ESLint Plugin Router
+---
+
+TanStack Router comes with its own ESLint plugin. This plugin is used to enforce best practices and to help you avoid common mistakes.
+
+## Installation
+
+The plugin is a separate package that you need to install:
+
+```bash
+$ npm i -D @tanstack/eslint-plugin-router
+```
+
+or
+
+```bash
+$ pnpm add -D @tanstack/eslint-plugin-router
+```
+
+or
+
+```bash
+$ yarn add -D @tanstack/eslint-plugin-router
+```
+
+or
+
+```bash
+$ bun add -D @tanstack/eslint-plugin-router
+```
+
+## Flat Config (`eslint.config.js`)
+
+### Recommended setup
+
+To enable all of the recommended rules for our plugin, add the following config:
+
+```js
+import pluginRouter from '@tanstack/eslint-plugin-router'
+
+export default [
+  ...pluginRouter.configs['flat/recommended'],
+  // Any other config...
+]
+```
+
+### Custom setup
+
+Alternatively, you can load the plugin and configure only the rules you want to use:
+
+```js
+import pluginRouter from '@tanstack/eslint-plugin-router'
+
+export default [
+  {
+    plugins: {
+      '@tanstack/router': pluginRouter,
+    },
+    rules: {
+      '@tanstack/router/create-route-property-order': 'error',
+    },
+  },
+  // Any other config...
+]
+```
+
+## Legacy Config (`.eslintrc`)
+
+### Recommended setup
+
+To enable all of the recommended rules for our plugin, add `plugin:@tanstack/eslint-plugin-router/recommended` in extends:
+
+```json
+{
+  "extends": ["plugin:@tanstack/eslint-plugin-router/recommended"]
+}
+```
+
+### Custom setup
+
+Alternatively, add `@tanstack/eslint-plugin-router` to the plugins section, and configure the rules you want to use:
+
+```json
+{
+  "plugins": ["@tanstack/eslint-plugin-router"],
+  "rules": {
+    "@tanstack/router/create-route-property-order": "error"
+  }
+}
+```
+
+## Rules
+
+- [@tanstack/router/create-route-property-order](../create-route-property-order)

package.json

@@ -79,6 +79,7 @@
       "@tanstack/router-arktype-adapter": "workspace:*",
       "@tanstack/start": "workspace:*",
       "@tanstack/start-vite-plugin": "workspace:*",
+      "@tanstack/eslint-plugin-router": "workspace:*",
       "temp-react": "0.0.0-experimental-035a41c4e-20230704",
       "temp-react-dom": "0.0.0-experimental-035a41c4e-20230704"
     }

packages/eslint-plugin-router/.attw.json

@@ -0,0 +1,3 @@
+{
+  "ignoreRules": ["false-export-default"]
+}

packages/eslint-plugin-router/eslint.config.js

@@ -0,0 +1,5 @@
+// @ts-check
+
+import rootConfig from '../../eslint.config.js'
+
+export default [...rootConfig]

packages/eslint-plugin-router/package.json

@@ -0,0 +1,65 @@
+{
+  "name": "@tanstack/eslint-plugin-router",
+  "version": "5.53.0",
+  "description": "ESLint plugin for TanStack Router",
+  "author": "Manuel Schiller",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/TanStack/router.git",
+    "directory": "packages/eslint-plugin-router"
+  },
+  "homepage": "https://tanstack.com/router",
+  "funding": {
+    "type": "github",
+    "url": "https://github.com/sponsors/tannerlinsley"
+  },
+  "scripts": {
+    "clean": "rimraf ./dist ./coverage",
+    "test:eslint": "eslint ./src",
+    "test:types": "pnpm run \"/^test:types:ts[0-9]{2}$/\"",
+    "test:types:ts51": "node ../../node_modules/typescript51/lib/tsc.js",
+    "test:types:ts52": "node ../../node_modules/typescript52/lib/tsc.js",
+    "test:types:ts53": "node ../../node_modules/typescript53/lib/tsc.js",
+    "test:types:ts54": "node ../../node_modules/typescript54/lib/tsc.js",
+    "test:types:ts55": "node ../../node_modules/typescript55/lib/tsc.js",
+    "test:types:ts56": "tsc",
+    "test:unit": "vitest",
+    "test:unit:dev": "pnpm run test:unit --watch --typecheck",
+    "test:build": "publint --strict && attw --pack .",
+    "build": "vite build"
+  },
+  "type": "module",
+  "types": "dist/esm/index.d.ts",
+  "main": "dist/cjs/index.cjs",
+  "module": "dist/esm/index.js",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/esm/index.d.ts",
+        "default": "./dist/esm/index.js"
+      },
+      "require": {
+        "types": "./dist/cjs/index.d.cts",
+        "default": "./dist/cjs/index.cjs"
+      }
+    },
+    "./package.json": "./package.json"
+  },
+  "sideEffects": false,
+  "files": [
+    "dist",
+    "src"
+  ],
+  "dependencies": {
+    "@typescript-eslint/utils": "^8.3.0"
+  },
+  "devDependencies": {
+    "@typescript-eslint/rule-tester": "^8.3.0",
+    "combinate": "^1.1.11",
+    "eslint": "^9.9.1"
+  },
+  "peerDependencies": {
+    "eslint": "^8.57.0 || ^9.0.0"
+  }
+}