1 | ## Circular Dependency Plugin
|
---|
2 |
|
---|
3 | Detect modules with circular dependencies when bundling with webpack.
|
---|
4 |
|
---|
5 | Circular dependencies are often a necessity in complex software, the presence of a circular dependency doesn't always imply a bug, but in the case where you believe a bug exists, this module may help find it.
|
---|
6 |
|
---|
7 | ### Webpack Versions
|
---|
8 |
|
---|
9 | The latest major version of this plugin `5`, supports webpack `4.0.1` and greater as a peer dependency. Major version `4` of this plugin and below are intended to support webpack `3.x.x` and below as a peer dependency.
|
---|
10 |
|
---|
11 | ### Basic Usage
|
---|
12 |
|
---|
13 | ```js
|
---|
14 | // webpack.config.js
|
---|
15 | const CircularDependencyPlugin = require('circular-dependency-plugin')
|
---|
16 |
|
---|
17 | module.exports = {
|
---|
18 | entry: "./src/index",
|
---|
19 | plugins: [
|
---|
20 | new CircularDependencyPlugin({
|
---|
21 | // exclude detection of files based on a RegExp
|
---|
22 | exclude: /a\.js|node_modules/,
|
---|
23 | // include specific files based on a RegExp
|
---|
24 | include: /dir/,
|
---|
25 | // add errors to webpack instead of warnings
|
---|
26 | failOnError: true,
|
---|
27 | // allow import cycles that include an asyncronous import,
|
---|
28 | // e.g. via import(/* webpackMode: "weak" */ './file.js')
|
---|
29 | allowAsyncCycles: false,
|
---|
30 | // set the current working directory for displaying module paths
|
---|
31 | cwd: process.cwd(),
|
---|
32 | })
|
---|
33 | ]
|
---|
34 | }
|
---|
35 | ```
|
---|
36 |
|
---|
37 | ### Advanced Usage
|
---|
38 |
|
---|
39 | ```js
|
---|
40 | // webpack.config.js
|
---|
41 | const CircularDependencyPlugin = require('circular-dependency-plugin')
|
---|
42 |
|
---|
43 | module.exports = {
|
---|
44 | entry: "./src/index",
|
---|
45 | plugins: [
|
---|
46 | new CircularDependencyPlugin({
|
---|
47 | // `onStart` is called before the cycle detection starts
|
---|
48 | onStart({ compilation }) {
|
---|
49 | console.log('start detecting webpack modules cycles');
|
---|
50 | },
|
---|
51 | // `onDetected` is called for each module that is cyclical
|
---|
52 | onDetected({ module: webpackModuleRecord, paths, compilation }) {
|
---|
53 | // `paths` will be an Array of the relative module paths that make up the cycle
|
---|
54 | // `module` will be the module record generated by webpack that caused the cycle
|
---|
55 | compilation.errors.push(new Error(paths.join(' -> ')))
|
---|
56 | },
|
---|
57 | // `onEnd` is called before the cycle detection ends
|
---|
58 | onEnd({ compilation }) {
|
---|
59 | console.log('end detecting webpack modules cycles');
|
---|
60 | },
|
---|
61 | })
|
---|
62 | ]
|
---|
63 | }
|
---|
64 | ```
|
---|
65 |
|
---|
66 | If you have some number of cycles and want to fail if any new ones are
|
---|
67 | introduced, you can use the life cycle methods to count and fail when the
|
---|
68 | count is exceeded. (Note if you care about detecting a cycle being replaced by
|
---|
69 | another, this won't catch that.)
|
---|
70 |
|
---|
71 | ```js
|
---|
72 | // webpack.config.js
|
---|
73 | const CircularDependencyPlugin = require('circular-dependency-plugin')
|
---|
74 |
|
---|
75 | const MAX_CYCLES = 5;
|
---|
76 | let numCyclesDetected = 0;
|
---|
77 |
|
---|
78 | module.exports = {
|
---|
79 | entry: "./src/index",
|
---|
80 | plugins: [
|
---|
81 | new CircularDependencyPlugin({
|
---|
82 | onStart({ compilation }) {
|
---|
83 | numCyclesDetected = 0;
|
---|
84 | },
|
---|
85 | onDetected({ module: webpackModuleRecord, paths, compilation }) {
|
---|
86 | numCyclesDetected++;
|
---|
87 | compilation.warnings.push(new Error(paths.join(' -> ')))
|
---|
88 | },
|
---|
89 | onEnd({ compilation }) {
|
---|
90 | if (numCyclesDetected > MAX_CYCLES) {
|
---|
91 | compilation.errors.push(new Error(
|
---|
92 | `Detected ${numCyclesDetected} cycles which exceeds configured limit of ${MAX_CYCLES}`
|
---|
93 | ));
|
---|
94 | }
|
---|
95 | },
|
---|
96 | })
|
---|
97 | ]
|
---|
98 | }
|
---|
99 | ```
|
---|
100 |
|
---|
101 | ### Maintenance
|
---|
102 |
|
---|
103 | This module is maintained despite few changes being necessary, please open issues if you find any bugs relating to integration with webpack core.
|
---|