-
Notifications
You must be signed in to change notification settings - Fork 13k
Description
Search Terms:
TS7023: implicitly has return type 'any' because it does not have a return type annotation and is referenced directly or indirectly in one of its return expressions.
TS7022: implicitly has type 'any' because it does not have a type annotation and is referenced directly or indirectly in its own initializer
- noImplicitAny
- React, JSX, TSX, render
Code
import * as React from "react"
declare function create<T>(arg: { comp: React.ComponentClass<T> }): React.ComponentClass<T>
class MyComponent extends React.Component<any, any> {
render() {
return <div><GeneratedComp /></div>
}
}
const GeneratedComp = create({
comp: MyComponent
})
Current Behavior
In strict mode the code above will have noImplicitAny errors for GeneratedComp
and render
because they indirectly reference each other. The workaround today is to explicitly annotate the render
function as returning something like React.ReactNode
.
Desired Behavior
The code above would ideally compile without errors and GeneratedComp
would have the expected ComponentClass<T>
type instead of any
type.
Motivation
I've been playing around with an idea for a typescript routing library that would dynamically generate statically typed link components as you configure it, but actually using that link component naturally requires circular references which hits the behavior above. It's still just as easy to workaround by adding a type annotation to render
, but if you forget to do that basically everything in the project starts having errors because of how intertwined it is.
- This is an example an of setting up a link
- This is an example of using it
- These are the types generating it
Suggestion
I don't really know how to write up this suggestion beyond what I wrote in the "Desired Behavior" section above, so instead I put together a rough proof of concept of how allowing these types without explicit type annotations might work on a branch here. It isn't intended as a PR, my goal was just to get my example working any way I could to see if it was realistic. It appears it is at least possible so now the question is if this behavior would be considered desirable to add to Typescript.
Related Issues:
Some past issues I found that likely would start working with this type of change:
#17386
#16892
#11628
#8546
#5403