# Tanstack Query Intent Compositions Enforce Query Best P 48bbbabb

> Use this when configuring @tanstack/eslint-plugin-query, flat/recommended, flat/recommended-strict, exhaustive-deps, no-rest-destructuring, no-unstable-deps, no-void-query-fn, stable-query-client, prefer-query-options, infinite-query-property-order, and mutation-property-order.

- Skill: `lukasa1993/tanstack-query-intent-compositions-enforce-query-best-p-48bb` (Agent Skill, multi-file: 3 files)
- Install (CLI): `npx skillmds@latest add lukasa1993/tanstack-query-intent-compositions-enforce-query-best-p-48bb`
- Raw SKILL.md: https://api.skillmd.com/api/skills/lukasa1993/tanstack-query-intent-compositions-enforce-query-best-p-48bb/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Integrations & APIs
- License: MIT
- Author: lukasa1993 (https://skillmd.com/u/lukasa1993)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/lukasa1993/tanstack-query-intent-compositions-enforce-query-best-p-48bb

---


## Setup

```js
import pluginQuery from '@tanstack/eslint-plugin-query'

export default [...pluginQuery.configs['flat/recommended']]
```

## Core Integration Patterns

### Use strict when generating Query-heavy code

```js
import pluginQuery from '@tanstack/eslint-plugin-query'

export default [...pluginQuery.configs['flat/recommended-strict']]
```

### Prefer option factories

```ts
import { queryOptions, useQuery } from '@tanstack/react-query'

const todosOptions = queryOptions({
  queryKey: ['todos'],
  queryFn: async () => [{ id: 1 }],
})

export function useTodos() {
  return useQuery(todosOptions)
}
```

### Keep inference-sensitive property order

```ts
import { useInfiniteQuery } from '@tanstack/react-query'

export function useFeed() {
  return useInfiniteQuery({
    queryKey: ['feed'],
    queryFn: async ({ pageParam }) => ({ nextCursor: pageParam + 1 }),
    initialPageParam: 0,
    getNextPageParam: (page) => page.nextCursor,
  })
}
```

## Common Mistakes

### MEDIUM Strict rule not enabled

Wrong:

```js
import pluginQuery from '@tanstack/eslint-plugin-query'

export default [...pluginQuery.configs['flat/recommended']]
```

Correct:

```js
import pluginQuery from '@tanstack/eslint-plugin-query'

export default [...pluginQuery.configs['flat/recommended-strict']]
```

Strict mode catches option-factory and inference patterns that agents commonly miss.

Source: TanStack/query:docs/eslint/eslint-plugin-query.md

### MEDIUM Infinite option property order

Wrong:

```ts
import { useInfiniteQuery } from '@tanstack/react-query'

export function useFeed() {
  return useInfiniteQuery({
    queryFn: async () => ({ nextCursor: 1 }),
    queryKey: ['feed'],
    getNextPageParam: (page) => page.nextCursor,
    initialPageParam: 0,
  })
}
```

Correct:

```ts
import { useInfiniteQuery } from '@tanstack/react-query'

export function useFeed() {
  return useInfiniteQuery({
    queryKey: ['feed'],
    queryFn: async ({ pageParam }) => ({ nextCursor: pageParam + 1 }),
    initialPageParam: 0,
    getNextPageParam: (page) => page.nextCursor,
  })
}
```

Some infinite-query inference depends on stable option ordering.

Source: TanStack/query:docs/eslint/infinite-query-property-order.md

### MEDIUM Mutation option property order

Wrong:

```ts
import { useMutation } from '@tanstack/react-query'

export function useSave() {
  return useMutation({
    onSuccess: () => console.log('saved'),
    mutationFn: async (title: string) => title,
  })
}
```

Correct:

```ts
import { useMutation } from '@tanstack/react-query'

export function useSave() {
  return useMutation({
    mutationFn: async (title: string) => title,
    onSuccess: () => console.log('saved'),
  })
}
```

The mutation property order rule preserves inference for mutation options.

Source: TanStack/query:docs/eslint/mutation-property-order.md

See also: `core/design-query-keys-and-options` for the patterns these rules protect.

