Is there a way to detect (static analysis tools like eslint, ??) Circular Dependencies in javascript. More like
module A imports module B module B imports module A
I had some trouble with this when using @flowtype and like to see where it happening in my moderate size codebase.
My code use ES6 module system and uses babel + webpack to bundle it.
By running a cli command npx madge --circular --extensions ts ./ we can quickly get a list of circular dependencies of all . ts files in current directory and its subdirectories.
and, yes, cyclic dependencies are bad: They cause programs to include unnecessary functionality because things are dragged in which aren't needed. They make it a lot harder to test software. They make it a lot harder to reason about software.
To reduce or eliminate circular dependencies, architects must implement loose component coupling and isolate failures. One approach is to use abstraction to break the dependency chain. To do this, you introduce an abstracted service interface that delivers underlying functionality without direct component coupling.
It is caused by circular dependencies that cannot be resolved synchronously by webpack. One is undefined, hence the error.
You can use the circular dependency plugin for webpack: https://www.npmjs.com/package/circular-dependency-plugin
You can also use madge to statically detect circular references: https://github.com/pahen/madge
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With