Dependency diagram in Dart/Flutter?

Question

Is there a way to see how libraries in my Flutter package depend on each other? Under libraries, I mean internal libraries, dart files under 'lib'. Also, it would be great to check for circular dependencies between the libraries.

Lyle

Answer 1

LayerLens can continuously auto-generate dependency diagrams for your package.

Lyle

Answer 2

You can use below command to see your flutter app's dependency graph.

flutter pub deps

The dependency information is printed as a tree, a list, or a compact list.

Suzetta

It is very interesting to know. However, I am interested to see internal dependencies in my application, not external. I updated my question to make it clear. – Lyle

Pass the --no-dev option to hide dev_dependencies. – Mita

dude you rock🤘 – Ulyssesumayyad

Answer 3

I was also looking for a tool to show internal dependencies but couldn't find one. So I wrote a tool called Lakos to visualize Dart/Flutter library dependencies in Graphviz. Lakos will visualize dependencies inside your project, not external package dependencies. Lakos will also warn about dependency cycles with an exit code.

https://pub.dev/packages/lakos

Example usage:

lakos --metrics . | dot -Tpng -Gdpi=200 -o lakos_example.png

The output will look similar to this:

Multiplex

Beautiful! This worked great for me to understand the screens hierarchy of a new project. – Castorena

This is really great @Oleg Alexander, exactly what I was looking for! However, the graphs tend to get very hairy for larger projects. Is there a way to produce a graph only at the coarser level of subdirectories (I believe you call them "subgraphs" in lakos)? – Adriell

@Adriell Thanks for the kind words. Unfortunately, there's no way to treat the subdirectories as nodes themselves. But you could try rendering the nodes as points, like this: lakos . | dot -Tpng -Gdpi=200 -Nshape=point -o example.png – Multiplex

1. Install the Graphviz Interactive Preview extension for the VS Code 2. $ dart pub global activate lakos 3. $ flutter pub add lakos 4. $ lakos -o dot_images/lakos.metrics_no_test.dot -m -i test/** . 5. open the generated lakos.metrics_no_test.dot 6. press the preview button – Pintail

I'm in quite a big project, I'm creating .svg but it is cutoff from the bottom, can't see much, any ideas? – Rosa