https://github.com/deejayy/ts-depgraph

Generate a visually stunning dependency graph from your Angular or Typescript project
https://github.com/deejayy/ts-depgraph

angular dependency graph typescript visjs

Last synced: 10 months ago
JSON representation

Generate a visually stunning dependency graph from your Angular or Typescript project

• Host: GitHub
• URL: https://github.com/deejayy/ts-depgraph
• Owner: deejayy
• Created: 2020-12-05T16:13:21.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2021-06-21T17:53:03.000Z (almost 5 years ago)
• Last Synced: 2025-01-01T11:45:53.713Z (over 1 year ago)
• Topics: angular, dependency, graph, typescript, visjs
• Language: JavaScript
• Homepage:
• Size: 224 KB
• Stars: 33
• Watchers: 3
• Forks: 4
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Typescript (Angular) Dependency Graph drawer

Uses vis.js, check it out, it's pretty cool.

# Usage

```sh

npm install -g ts-depgraph

```

## Customize ```depgraph.config.js``` if you want

You can check the example in the package directory (```depgraph.config.js.example```) or you can leave it out completely, default starting folder is the current.

```projectDirectory```: this is the directory where your ```src``` directory is. Without trailing slash.  

```tsconfig```: if you have path aliases defined in tsconfig, you can refer it here. Otherwise ```projectDirectory/tsconfig.json``` is used.  

## Run graph generator

```bash

ts-depgraph

```

## Open depgraph.html

![](https://github.com/deejayy/ts-depgraph/raw/master/screenshot/shot-01.png)

Dark mode, yay!

![](https://github.com/deejayy/ts-depgraph/raw/master/screenshot/shot-02.png)