A tool to visualize React components tree.
Last updated 2 years ago by kariae .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install @kariae/rflow 
SYNC missed versions from official npm registry.


rflow is a developer tool to visualize React applications components hierarchy.


Importrant: please take in consideration that this project is still a work in progress, if for some reason your components or their data are not well extracted using rflow, feel free to fill an issue with the component's code in question.


$ npm install -g @kariae/rflow


Navigate to your React application and run rflow command

$ rflow

Open your favorite navigator, and go to http://localhost:8181.

If you want to generates a json file with your components data and without launching the frontend server you can use

$ rflow -o /path/to/output/components.json --no-front


Option Command Description
Directory --dir (-d) Source directory of React application. Defaults to current directory.
Port --front-port (-p) Frontend port. Default to 8181.
Output --output (-o) Output file.
Front --no-front Do not launch rflow frontend to see the results, in case you needs only the data.

How it works

rflow command first analyze the given directory to extract all the components using @babel/parser, and then by default launch a front server to display the collected information in a tree format.

rflow detects component's props if the component uses prop-types, no worries flow and typescript are in the roadmap.

My component is not figuring in the data extracted

If your component is not extracted from your code using rflow, please fill an issue indicating the code of your component, you will help the project a lot.


This project is licensed under the MIT License - see the LICENSE file for details

Current Tags

  • 1.0.1                                ...           latest (2 years ago)

1 Versions

  • 1.0.1                                ...           2 years ago
Maintainers (1)
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 0
Dependencies (11)
Dependents (0)

Copyright 2014 - 2016 © taobao.org |