Rules
no-use-context
Full Name in eslint-plugin-react-x
react-x/no-use-context
Full Name in @eslint-react/eslint-plugin
@eslint-react/no-use-context
Features
🔄
Presets
x
recommended
recommended-typescript
recommended-type-checked
Description
Replaces usages of useContext
with use
.
In React 19, use
is preferred over useContext
because it is more flexible.
In addition, it is recommended to enable the naming-convention/context-name
rule to enforce consistent naming conventions for contexts.
Examples
Before
import { useContext } from "react";
function Button() {
const theme = useContext(ThemeContext);
// ...
}
After
import { use } from "react";
function Button() {
const theme = use(ThemeContext);
// ...
}
Implementation
Further Reading
See Also
no-context-provider
Replaces usages of<Context.Provider>
with<Context>
.no-forward-ref
Replace usages offorwardRef
with passingref
as a prop.