Brief introduction of dependency-cruiser

Validate and visualize the dependencies of code

the dependent of React

Preface

If we want to know if code is redundant, or dependencies have not been installed etc. We can use the dependency-cruiser to analyze the dependencies of dir or file which can be visualized by graphviz.

In this article, we will look at how to use the dependency-cruiser.

How to use dependency-cruiser

We can install dependency-cruiser globally with npm i -g dependency-cruiser (locally is recommended). Then enter in the folder of project that we want to analyze, as an illustration, we can run the follow command in formidable:

depcruise --exclude "^node_modules" --output-type html src > dependencies.html

this will generate an html file dependencies.html which looks like

The dependency-cruiser supports output many types, like html , json , dot , text etc. You can refer this article to learn other supported types.

Concert dependency-cruiser with graphviz

The dot as output type will make dependency-cruiser write a graphviz dot format directed graph. We can use graphviz to visualize it. But we have to install graphviz additaionally.

In MacOS, we can use brew to install it:

brew install graphviz

Then we can output the graph visualization:

depcruise --exclude "^node_modules" --output-type dot src | dot -T jpg > dependencies.jpg
dependencies.jpg

If we can to output other format graph, replace the format type of dot -T [format] , for example, we generate a pdf file:

depcruise --exclude "^node_modules" --output-type dot src | dot -T pdf > dependencies.pdf

All of the output types that graphviz supported can refer to https://www.graphviz.org/docs/outputs/.

The main options of dependency-cruiser

Sometimes we may not care about some directory and want to exclude them. They are 4 options that can do it:

  1. –do-not-follow: don’t cruise modules adhering to this pattern any further
  2. –include-only: only include modules satisfying a pattern
  3. –focus: show modules and their neighbours
  4. –exclude: exclude dependencies from being cruised

I will make some pictures help to understand this differ.

  1. –do-not-follow if matching this pattern, will not stop to cruise child modules.

2. –include-only only include modules satisfying a pattern, in this demo is plugins and parsers directory.

3. –focus will contain the modules and dependent or dependencies.

4. –exclude will drop the match pattern modules and their child modules.

Conclusion

In this article, we learn about how to use dependency-cruiser to analyze the dependencies of project, and we can use graphviz to make graph visualization of dependencies. dependency-cruiser supports many useful options to help us focus the modules we care about. If we want to refactor the code, this tool will be helpful.

Brief introduction of dependency-cruiser was originally published in Level Up Coding on Medium, where people are continuing the conversation by highlighting and responding to this story.


This content originally appeared on Level Up Coding - Medium and was authored by bitbug

Validate and visualize the dependencies of code

the dependent of React

Preface

If we want to know if code is redundant, or dependencies have not been installed etc. We can use the dependency-cruiser to analyze the dependencies of dir or file which can be visualized by graphviz.

In this article, we will look at how to use the dependency-cruiser.

How to use dependency-cruiser

We can install dependency-cruiser globally with npm i -g dependency-cruiser (locally is recommended). Then enter in the folder of project that we want to analyze, as an illustration, we can run the follow command in formidable:

depcruise --exclude "^node_modules" --output-type html src > dependencies.html

this will generate an html file dependencies.html which looks like

The dependency-cruiser supports output many types, like html , json , dot , text etc. You can refer this article to learn other supported types.

Concert dependency-cruiser with graphviz

The dot as output type will make dependency-cruiser write a graphviz dot format directed graph. We can use graphviz to visualize it. But we have to install graphviz additaionally.

In MacOS, we can use brew to install it:

brew install graphviz

Then we can output the graph visualization:

depcruise --exclude "^node_modules" --output-type dot src | dot -T jpg > dependencies.jpg
dependencies.jpg

If we can to output other format graph, replace the format type of dot -T [format] , for example, we generate a pdf file:

depcruise --exclude "^node_modules" --output-type dot src | dot -T pdf > dependencies.pdf

All of the output types that graphviz supported can refer to https://www.graphviz.org/docs/outputs/.

The main options of dependency-cruiser

Sometimes we may not care about some directory and want to exclude them. They are 4 options that can do it:

  1. --do-not-follow: don't cruise modules adhering to this pattern any further
  2. --include-only: only include modules satisfying a pattern
  3. --focus: show modules and their neighbours
  4. --exclude: exclude dependencies from being cruised

I will make some pictures help to understand this differ.

  1. --do-not-follow if matching this pattern, will not stop to cruise child modules.

2. --include-only only include modules satisfying a pattern, in this demo is plugins and parsers directory.

3. --focus will contain the modules and dependent or dependencies.

4. --exclude will drop the match pattern modules and their child modules.

Conclusion

In this article, we learn about how to use dependency-cruiser to analyze the dependencies of project, and we can use graphviz to make graph visualization of dependencies. dependency-cruiser supports many useful options to help us focus the modules we care about. If we want to refactor the code, this tool will be helpful.

Brief introduction of dependency-cruiser was originally published in Level Up Coding on Medium, where people are continuing the conversation by highlighting and responding to this story.


This content originally appeared on Level Up Coding - Medium and was authored by bitbug


Print Share Comment Cite Upload Translate Updates
APA

bitbug | Sciencx (2022-10-26T02:45:03+00:00) Brief introduction of dependency-cruiser. Retrieved from https://www.scien.cx/2022/10/26/brief-introduction-of-dependency-cruiser/

MLA
" » Brief introduction of dependency-cruiser." bitbug | Sciencx - Wednesday October 26, 2022, https://www.scien.cx/2022/10/26/brief-introduction-of-dependency-cruiser/
HARVARD
bitbug | Sciencx Wednesday October 26, 2022 » Brief introduction of dependency-cruiser., viewed ,<https://www.scien.cx/2022/10/26/brief-introduction-of-dependency-cruiser/>
VANCOUVER
bitbug | Sciencx - » Brief introduction of dependency-cruiser. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2022/10/26/brief-introduction-of-dependency-cruiser/
CHICAGO
" » Brief introduction of dependency-cruiser." bitbug | Sciencx - Accessed . https://www.scien.cx/2022/10/26/brief-introduction-of-dependency-cruiser/
IEEE
" » Brief introduction of dependency-cruiser." bitbug | Sciencx [Online]. Available: https://www.scien.cx/2022/10/26/brief-introduction-of-dependency-cruiser/. [Accessed: ]
rf:citation
» Brief introduction of dependency-cruiser | bitbug | Sciencx | https://www.scien.cx/2022/10/26/brief-introduction-of-dependency-cruiser/ |

Please log in to upload a file.



There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.

Related Posts