#React-Project-Graph
Hobby project to create a VISNetwork compatible map of react imported
components and files used inside the application.
Current Version
The current version is very basic, so use with caution.
It's possible to specify a root folder and get a .txt file with
the DOT String in it.
The DOT string can then be imported into whatever mapping tool your have laying around,
I prefer VisJS to load up the file
and display it inside the browser.
Based on the project size that is scanned, the file might take a while to load in the current version.
Upcoming Ideas
A few ideas I have at the moment is adding support to detect:
- Mark unused imports with a red line
- Mark completly unused files, even when imported with a red node
- Nodes that are imported more than 5 times should be blue
- Nodes that have more than 10 imports should be green
- Mark nodes pink that have mismatching exports/filesnames
How to use
node index.js -p <path to src in your react app>
The dot string will the written to dotstring.txt
There is an index.html that has visjs-network setup to load
the dotstring by default.
I use it with
python -m SimpleHTTPServer