+
-
+
- 
-
- 
-
-
- 
-
-
- 
-
+
+
+
+
+
+
+
+
> A graph with circular dependencies. Blue has dependencies, green has no dependencies, and red has circular dependencies.
- 
+
## See it in action
- 
+
# Installation
@@ -244,29 +239,30 @@ You can use configuration file either in `.madgerc` in your project or home fold
```json
{
- "fontSize": "10px",
- "graphVizOptions": {
- "G": {
- "rankdir": "LR"
- }
- }
+ "fontSize": "10px",
+ "graphVizOptions": {
+ "G": {
+ "rankdir": "LR"
+ }
+ }
}
```
> package.json
+
```json
{
- "name": "foo",
- "version": "0.0.1",
- ...
- "madge": {
- "fontSize": "10px",
- "graphVizOptions": {
- "G": {
- "rankdir": "LR"
- }
- }
- }
+ "name": "foo",
+ "version": "0.0.1",
+ ...
+ "madge": {
+ "fontSize": "10px",
+ "graphVizOptions": {
+ "G": {
+ "rankdir": "LR"
+ }
+ }
+ }
}
```
@@ -298,7 +294,7 @@ madge path/src
madge path/src/foo path/src/bar
```
-> List dependencies from all *.js and *.jsx files found in a directory
+> List dependencies from all \*.js and \*.jsx files found in a directory
```sh
madge --extensions js,jsx path/src
@@ -394,24 +390,26 @@ Madge uses [dependency-tree](https://www.npmjs.com/package/dependency-tree) whic
Only one syntax is used by default. You can use both though if you're willing to take the degraded performance. Put this in your madge config to enable mixed imports.
For ES6 + CommonJS:
+
```json
{
- "detectiveOptions": {
- "es6": {
- "mixedImports": true
- }
- }
+ "detectiveOptions": {
+ "es6": {
+ "mixedImports": true
+ }
+ }
}
```
For TypeScript + CommonJS:
+
```json
{
- "detectiveOptions": {
- "ts": {
- "mixedImports": true
- }
- }
+ "detectiveOptions": {
+ "ts": {
+ "mixedImports": true
+ }
+ }
}
```
@@ -421,11 +419,11 @@ Put this in your madge config.
```json
{
- "detectiveOptions": {
- "es6": {
- "skipTypeImports": true
- }
- }
+ "detectiveOptions": {
+ "es6": {
+ "skipTypeImports": true
+ }
+ }
}
```
@@ -435,11 +433,11 @@ Put this in your madge config.
```json
{
- "detectiveOptions": {
- "ts": {
- "skipTypeImports": true
- }
- }
+ "detectiveOptions": {
+ "ts": {
+ "skipTypeImports": true
+ }
+ }
}
```
@@ -449,14 +447,14 @@ Put this in your madge config.
```json
{
- "detectiveOptions": {
- "ts": {
- "skipAsyncImports": true
- },
- "tsx": {
- "skipAsyncImports": true
- }
- }
+ "detectiveOptions": {
+ "ts": {
+ "skipAsyncImports": true
+ },
+ "tsx": {
+ "skipAsyncImports": true
+ }
+ }
}
```
@@ -468,10 +466,10 @@ Ensure you have this in your `.tsconfig` file.
```json
{
- "compilerOptions": {
- "module": "commonjs",
- "allowJs": true
- }
+ "compilerOptions": {
+ "module": "commonjs",
+ "allowJs": true
+ }
}
```
@@ -493,12 +491,12 @@ brew install graphviz
Try running madge with a different layout, here's a list of the ones you can try:
-* **dot** "hierarchical" or layered drawings of directed graphs. This is the default tool to use if edges have directionality.
+* **dot** "hierarchical" or layered drawings of directed graphs. This is the default tool to use if edges have directionality.
* **neato** "spring model'' layouts. This is the default tool to use if the graph is not too large (about 100 nodes) and you don't know anything else about it. Neato attempts to
minimize a global energy function, which is equivalent to statistical multi-dimensional scaling.
-* **fdp** "spring model'' layouts similar to those of neato, but does this by reducing forces rather than working with energy.
+* **fdp** "spring model'' layouts similar to those of neato, but does this by reducing forces rather than working with energy.
* **sfdp** multiscale version of fdp for the layout of large graphs.
@@ -511,7 +509,9 @@ minimize a global energy function, which is equivalent to statistical multi-dime
## Contributors
This project exists thanks to all the people who contribute.
-
+
+
+
## Donations ❤️
@@ -520,35 +520,35 @@ Thanks to the awesome people below for making donations! 🙏[Donate](https://pa
Bernard Stojanović (24 Mars, 2021)
- 
+
Ole Jørgen Brønner (Oct 8, 2020)
- 
+
+ 
+ 
+