A plugin for Chrome that allows to see dependencies graph in AngularJS apps.

Live demo: http://angularjs-graph.org

chrome plugin

Understand unfamiliar AngularJS apps faster

The plugin doesn't require a local copy of app to work. It generates dependency graph from Angular runtime data.

Try browsing to any AngularJS app online, like https://angular.io/. If any AngularJS app is detected, you'll see relevant information in the "AngularJS Graph" tab of Chrome Developer Tools.

Refactor your app

It can be useful to have an overview of dependency graph, which often reflects your app's architecture. The graph is automatically updated every time you refresh your app, so it's easy to include it in your coding workflow.

Have fun

Browsing your app architecture can be very enjoyable, especially if you're proud of your work. I personally can spend hours admiring my architectural design choices, every moment affirming more and more the extent of my awesomeness. So open AngularJS Graph, drag the nodes, and have the time of your life! Enjoy!!

Some features

  • sticky nodes - you can rearrange nodes in the graph
  • graph is auto-updated when tab is refreshed
  • ignore / filter nodes in the graph
  • search for particular components / modules