eslint-plugin-react
eslint-plugin-react copied to clipboard
function-component-definition should not match unfixable edge cases (TypeScript generics)
The documentation for the function-component-definition
rule helpfully points out, that certain cases in TypeScript code using generics can not be fixed.
For example this:
function Component<T>(props: Props<T>) {
return <div />;
};
can not be converted into an arrow function as the type parameter conflicts with JSX syntax.
Since that is the case, the rule should not highlight these cases as errors to begin with.
Thanks :) Also, generally great work on this plugin!
Note: There may be a suggestion to just add some more syntax, like <T extends unknown>
, to prevent the syntax collision. However not only does this conflict with other linting rules specifically designed to prevent this ( particularly (@typescript-eslint/no-unnecessary-type-constrain ), it also obscures the fact that code was added to alleviate a deficiency in the linter.
IMHO the only valid way to deal with this currently is to spam eslint-disable-next-line
, which is not great.
The patterns that aren't autofixable aren't necessarily un fixable - however, if there is a pattern that has no other possibility, you're right, we shouldn't warn on it.