Graph

Generate an interactive HTML dependency graph for your monorepo workspace. The output file is saved to .xflutter-cli/graph/graph.html and visualises all applications and shared packages with their relationships. Must be run from the workspace root.
xflutter_cli graph

Generated Graph

The CLI generates a D3.js powered interactive HTML file. Every node represents an application or a package. Arrows show which module depends on which.
Workspace graph — default view

Hover to explore relationships

Hover over any node in the graph or any item in the sidebar to instantly highlight its dependency chain. Unrelated nodes are dimmed so you can focus on what matters.
Workspace graph — Products node highlighted
Color legend:
  • BlueThe hovered / selected module
  • PurpleModules that depend on the selected module
  • GreenModules that the selected module depends on
In the screenshot above: Products is selected (blue) — CustomerApp and AdminApp depend on it (purple) — Core is a dependency of it (green).

Re-arrange nodes

Use the ≡ button (bottom-right corner of the graph) to re-run the force simulation and re-arrange all nodes. You can also drag any node to reposition it manually.