Rules
no-use-context
Replaces usage of 'useContext' with 'use'.
Full Name in eslint-plugin-react-x
react-x/no-use-contextFull Name in @eslint-react/eslint-plugin
@eslint-react/no-use-contextFeatures
🔄
Presets
x
recommended
recommended-typescript
recommended-type-checked
strict
strict-typescript
strict-type-checked
Rule Details
In React 19, use is preferred over useContext because it is more flexible.
In addition, enable the naming-convention/context-name rule to enforce consistent naming conventions for contexts.
Common Violations
Invalid
import { useContext } from "react";
function Button() {
const theme = useContext(ThemeContext);
// ...
}Valid
import { use } from "react";
function Button() {
const theme = use(ThemeContext);
// ...
}Resources
Further Reading
See Also
context-name
Enforces the context name to be a valid component name with the suffixContextno-context-provider
Replaces usage of<Context.Provider>with<Context>