Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

eslint-plugin-react-hooks: rules-of-hooks misses early-return violations in components with CJK (non-ASCII) names, and false-positives force disabling it

Offen
#37,665 1 Kommentar 1 Reaktion 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Anfängerfreundlichkeit
55/100
Issue-Typ
Bug
Klarheit
Größtenteils klar
Aktivitätsstatus
Aktiv
Tech-Stack
javascript, react
Bereich
frontend, tooling

Rechercherichtung

Start with the rules-of-hooks component-detection heuristic in eslint-plugin-react-hooks and reproduce the minimal example using the CJK component name. Compare diagnostics with the ASCII-named version, including both the missed early-return violation and the reported false positives. Done means non-ASCII component names receive the expected hook-order diagnostics without forcing unrelated functions to be treated as components.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

What version of eslint-plugin-react-hooks are you using?

7.0.0 (also reproducible on earlier versions)

What do you expect to happen?

react-hooks/rules-of-hooks should flag hook calls that appear after an early return inside a component whose name contains non-ASCII (CJK) characters — the same way it does for ASCII-named components.

What actually happens?

When the component name is a CJK identifier (common in our Chinese-language codebase), rules-of-hooks produces no diagnostics for early-return-followed-by-hooks. Worse, enabling the rule yields hundreds of false positives that look like "hook called outside a component" — presumably because the plugin's component-detection heuristic doesn't recognize non-ASCII function names as components.

This forced us to disable rules-of-hooks entirely, which removed static protection for exactly one class of real bug we shipped to production: a useCallback added after a loading-state early return crashed with React error #310 ("Rendered more hooks...") on the first render where the condition flipped. tsc and our eslint setup (rule off) could not catch it.

Reproduction
// 中文组件名 — rules-of-hooks stays silent on the violation below
export default function 双池视图() {
    const [切面, 设置切面] = useState<切面>('有待办');
    const [载荷, 设置载荷] = useState<载荷 | null>(null);
    if (三池查询.isPending || !载荷) return <p>正在读取…</p>;   // early return
    const 店名 = useCallback((id: number) => ids[id] ?? `店铺 ${id}`, []); // ← not flagged
    ...
}

Compare: renaming the component to PoolView makes the rule flag the useCallback after the early return as expected. A minimal standalone repro is available if useful.

Request

Support non-ASCII (at least CJK) identifiers in the component-detection heuristic used by rules-of-hooks, or expose an option to treat "hook called in a function whose name starts with use / a top-level function in a component module" as a component regardless of name script.

Vorherrschende Sprache
JavaScript
Sterne
251k
Forks
51.4k
Ø Merge
2 T. 4 Std.
Gemergte PRs (30 T.)
50

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus react/react

Alle Issues in react/react

Ähnliche Issues

Weitere Issues zu JavaScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.