eslint-plugin-react-hooks

eslint-plugin-react-hooks предоставляет правила ESLint, которые проверяют Правила React.

Этот плагин помогает находить нарушения правил React во время сборки и следить, чтобы компоненты и хуки соблюдали правила React ради корректности и производительности. Линты покрывают и базовые паттерны React (exhaustive-deps и rules-of-hooks), и проблемы, которые отмечает компилятор React. Этот плагин ESLint автоматически показывает диагностики компилятора React, и ими можно пользоваться, даже если приложение ещё не перешло на компилятор.

Примечание

Если компилятор сообщает диагностику, значит, он статически нашёл паттерн, который не поддерживается или нарушает Правила React. Обнаружив такое, компилятор автоматически пропускает эти компоненты и хуки, а остальное приложение по-прежнему компилирует. Так безопасные оптимизации охватывают максимум кода и не ломают приложение.

Для линта это значит, что не нужно исправлять все нарушения сразу. Разбирайте их в своём темпе, чтобы постепенно увеличивать число оптимизированных компонентов.

Рекомендуемые правила

Эти правила входят в пресет recommended плагина eslint-plugin-react-hooks:

• exhaustive-deps — проверяет, что массивы зависимостей хуков React содержат все нужные зависимости
• rules-of-hooks — проверяет, что компоненты и хуки следуют Правилам хуков
• component-hook-factories — проверяет функции высшего порядка, которые объявляют вложенные компоненты или хуки
• config — проверяет параметры конфигурации компилятора
• error-boundaries — проверяет, что для ошибок дочерних компонентов используются границы ошибок, а не try/catch
• gating — проверяет конфигурацию режима gating
• globals — проверяет, что во время рендера нет присваивания и изменения глобальных переменных
• immutability — проверяет, что пропсы, состояние и другие неизменяемые значения не мутируют
• incompatible-library — проверяет, что не используются библиотеки, несовместимые с мемоизацией
• preserve-manual-memoization — проверяет, что компилятор сохраняет существующую ручную мемоизацию
• purity — проверяет чистоту компонентов и хуков по вызовам заведомо нечистых функций
• refs — проверяет корректное использование рефов: их не читают и не записывают во время рендера
• set-state-in-effect — проверяет, что setState не вызывается синхронно в эффекте
• set-state-in-render — проверяет, что состояние не устанавливается во время рендера
• static-components — проверяет, что компоненты статичны и не создаются заново при каждом рендере
• unsupported-syntax — проверяет, что не используется синтаксис, который компилятор React не поддерживает
• use-memo — проверяет, что хук useMemo используется с возвращаемым значением

Источник — https://react.dev/reference/eslint-plugin-react-hooks/index

Комментарии