ESLint 插件路由器

ESLint 插件路由器

TanStack Router 提供了专属的 ESLint 插件。该插件用于强制执行最佳实践，并帮助您避免常见错误。

安装

该插件是一个独立包，需要单独安装：

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

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

或

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

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

或

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

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

或

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

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

扁平化配置 (eslint.config.js)

ESLint 9.0 版本引入了全新的扁平化配置格式。相比传统的 .eslintrc 格式，这种新格式更灵活，支持更细粒度的配置。TanStack Router ESLint 插件兼容这一新格式，并提供了推荐配置来启用所有建议规则。

自定义扁平化配置

您也可以单独加载插件并配置所需规则：

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

export default [
  {
    plugins: {
      '@tanstack/router': pluginRouter,
    },
    rules: {
      '@tanstack/router/create-route-property-order': 'error',
    },
  },
  // 其他配置...
]

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

export default [
  {
    plugins: {
      '@tanstack/router': pluginRouter,
    },
    rules: {
      '@tanstack/router/create-route-property-order': 'error',
    },
  },
  // 其他配置...
]

传统配置 (.eslintrc)

在 ESLint 9.0 之前，最常见的配置方式是通过 .eslintrc 文件。TanStack Router ESLint 插件仍支持这种配置方式。

自定义传统配置

或者在 plugins 中添加 @tanstack/eslint-plugin-router，并配置所需规则：

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"
  }
}

规则列表

TanStack Router ESLint 插件提供以下规则：

@tanstack/router/create-route-property-order

安装

扁平化配置 (eslint.config.js)

推荐的扁平化配置

自定义扁平化配置

传统配置 (.eslintrc)

推荐的传统配置

自定义传统配置

规则列表

Subscribe to Bytes

Subscribe to Bytes