molefrog / wouter

🥢 A minimalist-friendly ~2.1KB routing for React and Preact
https://npm.im/wouter
The Unlicense
6.65k stars 152 forks source link

Typescript problem with Route and react-error-boundary #430

Open AscendingEagle opened 6 months ago

AscendingEagle commented 6 months ago

There seems to be a Typescript problem with the Route tag:

If we use the react-error-boundary library like this:

const PageA: FC = () => {
  return <></>
}
export default withErrorBoundary(PageA, { FallbackComponent: ErrorFallback })

Then the following will throw a Typescript error on the component property:

<Route path="/pageA" component={PageA} />
TS2322: Type ForwardRefExoticComponent<RefAttributes<any>> is not assignable to type ComponentType<RouteComponentProps<{}>> | undefined
Type ForwardRefExoticComponent<RefAttributes<any>> is not assignable to type FunctionComponent<RouteComponentProps<{}>>
Types of property propTypes are incompatible.
Type WeakValidationMap<RefAttributes<any>> | undefined is not assignable to type
WeakValidationMap<RouteComponentProps<{}>> | undefined
Type WeakValidationMap<RefAttributes<any>> has no properties in common with type WeakValidationMap<RouteComponentProps<{}>>
index.d.ts(72, 3): The expected type comes from property component which is declared here on type IntrinsicAttributes & RouteProps<undefined, '/pageA'>

This problem does not happen with react-router-dom.

This appears to be only a syntactical error because the code still works as expected.