К основному содержанию
правило

react-query-cursorrules-prompt-file — правило для Cursor: React Query

Правило для Cursor, которое задаёт агенту соглашения по React Query: где держать QueryClient, как называть хуки и ключи запросов.

Установить в Cursor · Вручную: положить файлы Все способы и платформы ↓
.cursor/rules/react-query-cursorrules-prompt-file.mdc
Открыть на GitHub

Что делает react-query-cursorrules-prompt-file

Файл описывает, как писать код на React с React Query. Агент получает набор установок: функциональные компоненты с хуками, QueryClient и QueryClientProvider в корне приложения, отдельные хуки под запросы и мутации, ключи запросов для кеша, префетчинг, состояния загрузки и ошибок.

Структура папок задана заранее: src/components, src/hooks с подпапками useQueries и useMutations, src/pages, src/utils, src/api. Дальше идут дополнительные пункты — TypeScript, error boundaries под ошибки запросов, React Query DevTools, стратегия stale-while-revalidate, оптимистичные обновления мутаций, инвалидация запросов и единые имена по конвенциям библиотеки.

Правило применяется к файлам по маске **/*, но alwaysApply стоит в false — значит, его нужно подключать осознанно, иначе оно будет влиять на весь проект. Если вы уже держите свою раскладку папок или пишете на JavaScript без типов, часть пунктов придётся переписать под себя.

Какие задачи решает

  • задать агенту единый стиль работы с React Query
  • разложить хуки запросов и мутаций по отдельным папкам
  • договориться об именовании ключей запросов и кеше
  • добавить обработку ошибок и состояний загрузки в запросы
  • включить оптимистичные обновления и инвалидацию в мутациях

Примеры запросов агенту

  • Создай хук запроса списка задач в src/hooks/useQueries по правилам React Query
  • Добавь мутацию создания задачи с оптимистичным обновлением и инвалидацией
  • Настрой QueryClientProvider в корне приложения и вынеси ключи запросов в отдельный модуль

Как установить react-query-cursorrules-prompt-file

Вручную: положить файлы

.cursor/rules/react-query-cursorrules-prompt-file.mdc

Во frontmatter: description, globs, alwaysApply

По шагам, с командами для каждой платформы: Cursor rules: файлы .mdc, четыре режима и замена .cursorrules

Вопросы о react-query-cursorrules-prompt-file

Как установить react-query-cursorrules-prompt-file в Cursor?

Создайте файл .cursor/rules/react-query-cursorrules-prompt-file.mdc в корне проекта и вставьте в него содержимое правила.

Что делает react-query-cursorrules-prompt-file?

Задаёт агенту Cursor соглашения по React Query: расположение QueryClient, отдельные хуки под запросы и мутации, ключи для кеша, префетчинг, обработку ошибок и загрузки.

Правило применяется ко всем файлам автоматически?

Маска globs — **/*, но alwaysApply выставлен в false, поэтому правило подключается вручную.

Исходный текст

react-query-cursorrules-prompt-file.mdc · CC0-1.0
---
description: "Cursor rules for React development with React Query integration."
globs: **/*
alwaysApply: false
---
// React + React Query .cursorrules

// Prefer functional components with hooks

const preferFunctionalComponents = true;

// React Query best practices

const reactQueryBestPractices = [
  "Use QueryClient and QueryClientProvider at the root of your app",
  "Implement custom hooks for queries and mutations",
  "Utilize query keys for effective caching",
  "Use prefetching for improved performance",
  "Implement proper error and loading states",
];

// Folder structure

const folderStructure = `
src/
  components/
  hooks/
    useQueries/
    useMutations/
  pages/
  utils/
  api/
`;

// Additional instructions

const additionalInstructions = `
1. Use TypeScript for type safety with React Query
2. Implement proper error boundaries for query errors
3. Utilize React Query DevTools for debugging
4. Use stale-while-revalidate strategy for data freshness
5. Implement optimistic updates for mutations
6. Use query invalidation for data refetching
7. Follow React Query naming conventions for consistency
`;

© PatrickJS · CC0-1.0 · PatrickJS/awesome-cursorrules

Похожие правила IDE

Все правила IDE по теме «Фронтенд и UI» →
react-query Mindrally Задаёт агенту правила работы с React Query: кэширование, фоновые обновления, инвалидация запросов и оптимистичные апдейты. CX Codex +1 1 400установок tanstack-query-best-practices DeckardGer Свод правил TanStack Query для React: ключи запросов, кеш, мутации, SSR. Подключается к Claude Code, Codex, Cursor и Copilot — чтобы загрузка данных в проекте шла по одной схеме. CX Codex +1 12 800установок react-state-management Seth Hobson Помогает выбрать и настроить управление состоянием в React: локальное, глобальное, серверное, URL и состояние форм. CX Codex 15 286установок react-native alinaqi Скилл задаёт структуру проекта, паттерны компонентов и правила тестирования для React Native. Пригодится, когда агент правит .tsx или код под iOS и Android. CX Codex +1 566установок state-management agent-skills Скилл с готовыми паттернами TanStack Query v5 и Zustand v5: запросы, кеш, мутации, оптимистичные обновления и клиентские сторы. CX Codex +1 783установок tanstack-query tanstack-skills Скилл подсказывает агенту, как работать с TanStack Query v5: кэширование, инвалидация, мутации и оптимистичные обновления. CX Codex +1 9 900установок

Из того же набора68

rtl-right-to-left-i18n-cursorrules-prompt-file Правило Cursor, которое заставляет агента писать CSS и Tailwind по логическим свойствам, а не по left/right. Пригодится, если проект должен работать на арабском, иврите, персидском или урду. ★ 41 011звёзд репо react Правило задаёт агенту Cursor соглашения по React: структура компонентов, хуки, состояние, формы и доступность. Пригодится, когда в проекте много .tsx и .jsx и хочется единый стиль. ★ 41 011звёзд репо react-typescript-nextjs-nodejs-cursorrules-prompt- Правило для Cursor задаёт стиль кода на React, TypeScript, Next.js 14 и Node.js: функциональные компоненты, RORO, минимум use client. ★ 41 011звёзд репо react-styled-components-cursorrules-prompt-file Правило для Cursor, которое задаёт агенту стиль кода на React со styled-components: функциональные компоненты, тема через ThemeProvider, папка styles. ★ 41 011звёзд репо react-native-expo-cursorrules-prompt-file Правило для Cursor, которое задаёт агенту стек и структуру проекта на React Native с Expo. Пригодится, когда нужно, чтобы код в проекте писался единообразно. ★ 41 011звёзд репо rails-cursorrules-prompt-file Правило для Cursor, которое задаёт агенту стиль разработки на Rails 8: генераторы, bin/dev, Solid-стек, Minitest и Hotwire. ★ 41 011звёзд репо qwik-basic-cursorrules-prompt-file Правило Cursor, которое задаёт агенту соглашения Qwik: ленивые функции с суффиксом $, сигналы, задачи и структура проекта на TypeScript и Vite. ★ 41 011звёзд репо python Правило Cursor задаёт структуру проекта, стиль кода и типовые решения для Python с Flask и SQLite. Пригодится, когда агент пишет код в вашем репозитории. ★ 41 011звёзд репо

Спонсоры проекта

Компании, которые помогают держать аналитику открытой