Open bheklilr opened 5 years ago
Files with a .tsx
extension shouldn't take much work to get working. I will look into that part of this feature request first.
Did the tsx file extension get implemented? I don't see it in the README.md
Is this project still maintained?
I was dusting it off last night as someone brought up a suggestion. I got the dependencies up to date. Plan to start tackling some of these issues which are straight forward.
Opening this issue to request support for TSX files and to create class diagrams for React components.
Main goals
Caveats:
For these, I think it would make sense to use the file name as the component's name, unless the filename is "index.tsx", in which case the containing folder's name should be used. This should cover 99.9% of use cases.
If a component is in the form
const ComponentName = (props: SomePropsType) => <div />;
, then the const variable's name should be used as the component name.With react hooks, it is not possible to determine a hooks-based component's state. We can just ignore the state in these cases. If better tooling arises in the future for this from the react team (or a 3rd party), this could be revisited
Example
Input:
Output:
Not addressed
but that seems out of scope for this initial issue, and becomes more complicated with hooks.
Component diagrams could become incredibly large. It is typical for React projects to have a lot of components defined in them. Maybe support a
--max-component-depth
option or something to work around it?This would ignore any components that are made using
React.createElement
, but no one really does that anymore.Doesn't address how to handle 3rd party components. I'd say ignore them. 3rd party components are often written in JS and shipped with
.d.ts
files. This would be very difficult to support, and probably wouldn't be very useful anyway.