📄 tanstack/router/latest/docs/eslint/eslint-plugin-router

File: eslint-plugin-router.md | Updated: 11/15/2025

Source: https://tanstack.com/router/latest/docs/eslint/eslint-plugin-router



TanStack

Router v1v1

Search...

+ K

Auto

Log In

TanStack StartRC

Docs Examples GitHub Contributors

TanStack Router

Docs Examples GitHub Contributors

TanStack Query

Docs Examples GitHub Contributors

TanStack Table

Docs Examples Github Contributors

TanStack Formnew

Docs Examples Github Contributors

TanStack DBbeta

Docs Github Contributors

TanStack Virtual

Docs Examples Github Contributors

TanStack Paceralpha

Docs Examples Github Contributors

TanStack Storealpha

Docs Examples Github Contributors

TanStack Devtoolsalpha

Docs Github Contributors

More Libraries

Maintainers Partners Support Learn StatsBETA Discord Merch Blog GitHub Ethos Brand Guide

Documentation

Framework

React logo

React

Version

Latest

Search...

+ K

Menu

Getting Started

Installation Guides

Routing

Guides

API

Integrations

ESLint

Router Examples

Framework

React logo

React

Version

Latest

Menu

Getting Started

Installation Guides

Routing

Guides

API

Integrations

ESLint

Router Examples

On this page

ESLint Plugin Router

Copy Markdown

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:

sh

npm install -D @tanstack/eslint-plugin-router


npm install -D @tanstack/eslint-plugin-router

or

sh

pnpm add -D @tanstack/eslint-plugin-router


pnpm add -D @tanstack/eslint-plugin-router

or

sh

yarn add -D @tanstack/eslint-plugin-router


yarn add -D @tanstack/eslint-plugin-router

or

sh

bun add -D @tanstack/eslint-plugin-router


bun add -D @tanstack/eslint-plugin-router

Flat Config (eslint.config.js)
------------------------------

The release of ESLint 9.0 introduced a new way to configure ESLint using a flat config format. This new format is more flexible and allows you to configure ESLint in a more granular way than the legacy .eslintrc format. The TanStack Router ESLint Plugin supports this new format and provides a recommended config that you can use to enable all of the recommended rules for the plugin .

### Recommended Flat Config setup

To enable all of the recommended rules for our plugin, add the following config:

js

// eslint.config.js
import pluginRouter from '@tanstack/eslint-plugin-router'

export default [\
  ...pluginRouter.configs['flat/recommended'],\
  // Any other config...\
]


// eslint.config.js
import pluginRouter from '@tanstack/eslint-plugin-router'

export default [\
  ...pluginRouter.configs['flat/recommended'],\
  // Any other config...\
]

### Custom Flat Config setup

Alternatively, you can load the plugin and configure only the rules you want to use:

js

// eslint.config.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...\
]


// eslint.config.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)
-------------------------

Prior to the ESLint 9.0 release, the most common way of configuring EsLint was using a .eslintrc file. The TanStack Router ESLint Plugin still supports this configuration method.

### Recommended Legacy Config 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"]
}


{
  "extends": ["plugin:@tanstack/eslint-plugin-router/recommended"]
}

### Custom Legacy Config 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"
  }
}


{
  "plugins": ["@tanstack/eslint-plugin-router"],
  "rules": {
    "@tanstack/router/create-route-property-order": "error"
  }
}

Rules
-----

The following rules are available in the TanStack Router ESLint Plugin:

Conflicts with other ESLint plugins
-----------------------------------

If you have other ESLint plugins installed, they may rules that conflict with this plugin. If so, you'll need to make some tweaks to allow these plugins to work together.

### typescript-eslint

The @typescript-eslint/only-throw-error rule, enabled by default in the recommended-type-checked and strict-type-checked rulesets, disallows the throwing of non-Error values as exceptions, which is considered a good practice.

To make sure it that it does not conflict with TanStack Router, you should add redirect to the allowed as a throwable objects.

json

{
  "rules": {
    "@typescript-eslint/only-throw-error": [\
      "error",\
      {\
        "allow": [\
          {\
            "from": "package",\
            "package": "@tanstack/router-core",\
            "name": "Redirect"\
          }\
        ]\
      }\
    ]
  }
}


{
  "rules": {
    "@typescript-eslint/only-throw-error": [\
      "error",\
      {\
        "allow": [\
          {\
            "from": "package",\
            "package": "@tanstack/router-core",\
            "name": "Redirect"\
          }\
        ]\
      }\
    ]
  }
}

Edit on GitHub

TanStack Query

Create Route Property Order

Partners Become a Partner

Code RabbitCode Rabbit CloudflareCloudflare AG GridAG Grid NetlifyNetlify NeonNeon WorkOSWorkOS ClerkClerk ConvexConvex ElectricElectric SentrySentry PrismaPrisma StrapiStrapi UnkeyUnkey

scarf analytics