throw new Error('Cyclic dependency: '+JSON.stringify(node)) and followed by same output as above.

Not much changed in terms of environment that this is ran in, hence pinpointing it down to latest release

+1

For me too - the fix on my side was to downgrade the version of toposort to 1.0.4.

I didn't actually reference this dependency directly - webpack does - just fyi.

+1

@seanlandsman I think webpack is whats failing us as well, how did you downgrade toposort for it specifically? Never did it before for specific packages, would be cool to know :)

I'm using yarn, and added this to my package.json:

"resolutions": {
	"toposort": "1.0.4"
}

npm install toposort@1.0.4

+1 - affects html webpack plugin

+1

We're also hitting this. :(

+1 not too happy, respect semver! :(

@iljadaderko I added this to package.json

"toposort":"1.0.4"

thanks

+1

I'm so sorry folks. v1.0.6 is out now, which reverts #19

+1

Thanks for quick turnaround!

thanks for the quick fix. Our production build failed yesterday since it's the dependency of html-webpack-plugin

UPDATE: there's a workaround provided in jantimon/html-webpack-plugin#870 which is working for me at the moment. I'm leaving this comment up in case anybody else is affected.

I'm currently hitting this error in 1.0.6 too (through html-webpack-plugin).

> npm list toposort
rekrn@1.0.0 /Users/aditya/dev/rekrn
└─┬ webpack-config-basic-dev@2.0.0-0
  └─┬ html-webpack-plugin@3.2.0
    └── toposort@1.0.6

I made a new and clean repo to try and reproduce it but wasn't able to:

> npm list toposort
testwebpack4@1.0.0 /Users/aditya/dev/testwebpack4
└─┬ webpack-config-basic-dev@2.0.0-0
  └─┬ html-webpack-plugin@3.2.0
    └── toposort@1.0.6

Any help will be appreciated.

Full error dump:

 95% emitting HtmlWebpackPlugin/Users/aditya/dev/rekrn/node_modules/html-webpack-plugin/node_modules/toposort/index.js:29
      throw new Error('Cyclic dependency: '+JSON.stringify(node))
                                                 ^

TypeError: Converting circular structure to JSON
    at JSON.stringify (<anonymous>)
    at visit (/Users/aditya/dev/rekrn/node_modules/html-webpack-plugin/node_modules/toposort/index.js:29:50)
    at visit (/Users/aditya/dev/rekrn/node_modules/html-webpack-plugin/node_modules/toposort/index.js:47:9)
    at visit (/Users/aditya/dev/rekrn/node_modules/html-webpack-plugin/node_modules/toposort/index.js:47:9)
    at visit (/Users/aditya/dev/rekrn/node_modules/html-webpack-plugin/node_modules/toposort/index.js:47:9)
    at Function.toposort [as array] (/Users/aditya/dev/rekrn/node_modules/html-webpack-plugin/node_modules/toposort/index.js:22:22)
    at Object.module.exports.dependency (/Users/aditya/dev/rekrn/node_modules/html-webpack-plugin/lib/chunksorter.js:50:35)
    at HtmlWebpackPlugin.sortChunks (/Users/aditya/dev/rekrn/node_modules/html-webpack-plugin/index.js:364:35)
    at /Users/aditya/dev/rekrn/node_modules/html-webpack-plugin/index.js:113:21
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/Users/aditya/dev/rekrn/node_modules/tapable/lib/HookCodeFactory.js:24:12), <anonymous>:14:1)
    at AsyncSeriesHook.lazyCompileHook [as _callAsync] (/Users/aditya/dev/rekrn/node_modules/tapable/lib/Hook.js:35:21)
    at Compiler.emitAssets (/Users/aditya/dev/rekrn/node_modules/webpack/lib/Compiler.js:305:19)
    at onCompiled (/Users/aditya/dev/rekrn/node_modules/webpack/lib/Watching.js:50:19)
    at hooks.afterCompile.callAsync.err (/Users/aditya/dev/rekrn/node_modules/webpack/lib/Compiler.js:485:14)
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/Users/aditya/dev/rekrn/node_modules/tapable/lib/HookCodeFactory.js:24:12), <anonymous>:15:1)
    at AsyncSeriesHook.lazyCompileHook [as _callAsync] (/Users/aditya/dev/rekrn/node_modules/tapable/lib/Hook.js:35:21)

Reproduction in case anyone needs it. Error is thrown when building angular app in AoT mode.

Sorry for my absence. Can you reproduce this with toposort only? Alternatively, what does the dependency graph look like?

So, when I run the build script for the reproduction repo, I get the following edges of the dependency graph:

5005 => 5004,
5003 => 5004,
5004 => 5005,
5003 => 5005

Clearly, there is a cyclic dependency between 5005 and 5004. The only "bug" in toposort, is the type error, if you will, which I'll fix now. :)

@WiseBird I found that error happiness if html-webpack-plugin uses default chunksSortMode parameter.
For example, you can change it in the following way:

new HtmlWebpackPlugin({
     "template": "./src/index.html",
     "filename": "./index.html",
     "hash": false,
     "inject": true,
     "compile": true,
     "favicon": false,
     "minify": false,
     "cache": true,
     "showErrors": true,
     "chunks": "all",
     "excludeChunks": [],
     "title": "Webpack App",
     "xhtml": true,
     "chunksSortMode": 'none'
   }
 }),

Or use your special function. For example:

const entryPoints = ["inline","polyfills","sw-register","styles","vendor","main"];
...
chunksSortMode: function sort(left, right) {
  let leftIndex = entryPoints.indexOf(left.names[0]);
  let rightIndex = entryPoints.indexOf(right.names[0]);
  if (leftIndex > rightIndex) {
      return 1;
  }
  else if (leftIndex < rightIndex) {
      return -1;
  }
  else {
      return 0;
  }
}
...

I found that error happiness if html-webpack-plugin uses default chunksSortMode parameter.

@sumbad do you mean that this cyclic dependency error does not occur when chunksSortMode option of HtmlWebpackPlugin is set to 'none'?
If that's what you mean then it's the same for me since I switched to webpack 4.

Should we open an HtmlWebpackPlugin issue?

@laurentpayot there already is one: jantimon/html-webpack-plugin#870 ;)

@WiseBird I found that error happiness if html-webpack-plugin uses default chunksSortMode parameter.
For example, you can change it in the following way:

new HtmlWebpackPlugin({
     "template": "./src/index.html",
     "filename": "./index.html",
     "hash": false,
     "inject": true,
     "compile": true,
     "favicon": false,
     "minify": false,
     "cache": true,
     "showErrors": true,
     "chunks": "all",
     "excludeChunks": [],
     "title": "Webpack App",
     "xhtml": true,
     "chunksSortMode": 'none'
   }
 }),

Or use your special function. For example:

const entryPoints = ["inline","polyfills","sw-register","styles","vendor","main"];
...
chunksSortMode: function sort(left, right) {
  let leftIndex = entryPoints.indexOf(left.names[0]);
  let rightIndex = entryPoints.indexOf(right.names[0]);
  if (leftIndex > rightIndex) {
      return 1;
  }
  else if (leftIndex < rightIndex) {
      return -1;
  }
  else {
      return 0;
  }
}
...

厉害了我的哥

I also get this error without specifying chunksSortMode as none.

i'm seeing this error with 1.0.7 in a dojo project

$ npm list toposort
project@1.0.0 C:\development\projects\xxx\project
`-- @dojo/cli-build-app@5.0.3
  `-- html-webpack-plugin@3.2.0
    `-- toposort@1.0.7

change chucksSortMode to none fixes it

@WiseBird I found that error happiness if html-webpack-plugin uses default chunksSortMode parameter.
For example, you can change it in the following way:

new HtmlWebpackPlugin({
     "template": "./src/index.html",
     "filename": "./index.html",
     "hash": false,
     "inject": true,
     "compile": true,
     "favicon": false,
     "minify": false,
     "cache": true,
     "showErrors": true,
     "chunks": "all",
     "excludeChunks": [],
     "title": "Webpack App",
     "xhtml": true,
     "chunksSortMode": 'none'
   }
 }),

Or use your special function. For example:

const entryPoints = ["inline","polyfills","sw-register","styles","vendor","main"];
...
chunksSortMode: function sort(left, right) {
  let leftIndex = entryPoints.indexOf(left.names[0]);
  let rightIndex = entryPoints.indexOf(right.names[0]);
  if (leftIndex > rightIndex) {
      return 1;
  }
  else if (leftIndex < rightIndex) {
      return -1;
  }
  else {
      return 0;
  }
}
...

yes, change to chucksSortMode to none in webpack config file fixes it