Take 🌰 for example

Below is the vConsole dependency diagram. The dependencies are clear and clear. It is a good example of good code

madge

Madge User manual

Install madge

npm -g install madge
Copy the code

Install graphviz

Mac OS X

brew install graphviz || port install graphviz
Copy the code

Ubuntu

apt-get install graphviz
Copy the code

The following uses Mac OS X as an example:

1, install the brew install graphviz | | port install graphviz error, without permission

Executing sudo chown -r $(whoami)/usr/local/share/man/man5 / usr/local/share/man/man7 authorization

2, again the brew install graphviz | | port install graphviz error, suggest a lack of tools

Run the xcode-select -install command to install xcode-select

3, again the brew install graphviz | | port install graphviz error, prompt without permission

3.1. Create a directory

Run sudo mkdir /usr/local/frameworks

3.2, authorization,

Sudo chown $(whoami):admin /usr/local/frameworks

4, the last execution the brew install graphviz | | port install graphviz installation is successful

Export the dependency diagram

madge --image /Users/rainzhao/collect/vConsole/dependency.svg /Users/rainzhao/collect/vConsole/src/vconsole.js
Copy the code

Refer to the Madge manual for more functions