Nx: Max Call Stack error when running build --with-deps

[yharaskrik]

Current Behavior

After upgrading to Nx v9 running nx build --with-deps fails with the following error

/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:72
    function recur(node) {
                  ^

RangeError: Maximum call stack size exceeded
    at recur (/Users/jaybell/WebstormProjects/shinkansen/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:72:19)
    at /Users/jaybell/WebstormProjects/shinkansen/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:76:13
    at Array.forEach (<anonymous>)
    at recur (/Users/jaybell/WebstormProjects/shinkansen/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:75:12)
    at /Users/jaybell/WebstormProjects/shinkansen/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:76:13
    at Array.forEach (<anonymous>)
    at recur (/Users/jaybell/WebstormProjects/shinkansen/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:75:12)
    at /Users/jaybell/WebstormProjects/shinkansen/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:76:13
    at Array.forEach (<anonymous>)
    at recur (/Users/jaybell/WebstormProjects/shinkansen/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:75:12)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

This errors shows up with 4/5 of my Angular apps and 1/2 of my Nest apps.

The 1 angular app and 1 nest app that work are both pretty small compared to the others.

Running build normally nx build works totally fine.

Expected Behavior

Even though I have no buildable libraries I would expect that a build would succeed with the -with-deps flag like it does for the one angular app.

Steps to Reproduce

I am not able to repro this on nx-examples, which leads me to believe that it has something to do with my repository itself.

When I serve the apps that do not work with the deps flag there are no circular deps detected.

I have compared my tsconfig files and angular.json records with those of the apps that do work and there are no (or only slight) differences, even when they are identical the apps still fail to build --with-deps.

The error seems to be happening while it builds the dependency graph to determine what dependencies to build but when I run affected:dep-graph it runs fine, no max call stack error. I am also able to run tests fine.

I have tried it on nx v9.5.1, 9.5.0 and 9.4.0 just to see if it was a regression in a minor or patch version.

Even if I remove all module imports in my AppModule for an app that does not build (and their associated imports) as well as deleting all routes in the AppRoutingModule the build still fails with the same error (even though theoretically the app isn't depending on anything, for the most part)

Please let me know if there is any information I am missing or any specific configuration files that would be helpful to see.

Environment

 @nrwl/angular : 9.4.5
  @nrwl/cli : 9.4.5
  @nrwl/cypress : 9.4.5
  @nrwl/eslint-plugin-nx : Not Found
  @nrwl/express : 9.4.5
  @nrwl/jest : 9.4.5
  @nrwl/linter : 9.4.5
  @nrwl/nest : 9.4.5
  @nrwl/next : Not Found
  @nrwl/node : 9.4.5
  @nrwl/react : Not Found
  @nrwl/schematics : Not Found
  @nrwl/tao : 9.4.5
  @nrwl/web : Not Found
  @nrwl/workspace : 9.4.5
  typescript : 3.8.3

[yharaskrik]

Update:

1. Tried with Angular v10 just to see, same error
2. Downgraded Nx to v9.0.0 got

 NX   WARNING  The Angular CLI was invoked instead of the Nx CLI. Use "npx ng [command]" or "nx [command]" instead.

3 Downgraded to Nx v9.1.4 but got the same max call stack error

[yharaskrik]

I am able to reliably recreate the problem now. I will create a repository and provide it here.

[yharaskrik]

Ok here is a repo: https://github.com/yharaskrik/circular-import-demo

Run yarn nx build demo --with-deps or yarn nx build demo2 --with-deps (one has component spec files with circular dep and one has module spec files with circular dep)

I realize that technically this is wrong and we should not have circular dependencies but they aren't circular without the build of our app so they shouldn't affect the building of the apps themselves. I can try and hunt down whatever circular dependencies we have but maybe the nx cli should take this into account and ignore spec files when determining dependencies for building?

Oddly it does not max call stack error when building the dep graph straight up, only when finding the deps during build.

[maxime1992]

Just gave a go this morning to making all of our libs buildable and I've got the same issue.

I can build one or 2 libs which have no dependencies but I cannot build most of our libs with --with-deps otherwise I get

/home/maxime/Documents/cloudnc/code/frontend/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:75
        ds.forEach(n => {
           ^

RangeError: Maximum call stack size exceeded
    at Array.forEach (<anonymous>)
    at recur (/home/maxime/Documents/cloudnc/code/frontend/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:75:12)
    at /home/maxime/Documents/cloudnc/code/frontend/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:76:13
    at Array.forEach (<anonymous>)
    at recur (/home/maxime/Documents/cloudnc/code/frontend/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:75:12)
    at /home/maxime/Documents/cloudnc/code/frontend/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:76:13
    at Array.forEach (<anonymous>)
    at recur (/home/maxime/Documents/cloudnc/code/frontend/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:75:12)
    at /home/maxime/Documents/cloudnc/code/frontend/node_modules/@nrwl/workspace/src/core/project-graph/operators.js:76:13
    at Array.forEach (<anonymous>)

Same for the app

[yharaskrik]

@maxime1992 I was able to track down some circular dependencies by using an npm package called madge still working through resolving them so I can give this a go again to see if that really is the case.

[maxime1992]

@yharaskrik thanks for sharing madge, I never used it before.

How are you using it in the context of nx? I tried npx madge --circular apps/my-app/src/main.ts which indeed found a few circular deps but only in this app and only a few (6). I'm pretty sure there are also some in libraries :thinking: Maybe you've got a better way of launching madge?

[yharaskrik]

Ya! So the command I ran (I'm on my phone so might have it slightly wrong) was

madge --circular --extensions ts --ts-config tsconfig.json . note the period at the end to search in full repo.

[yharaskrik]

Update: I went and resolved all of the circular dependencies that were found by using madge as described above. And I somehow made it worse. Now the one angular app that did build --with-deps before is not building with the flag anymore.

The Nest app still works though (it is very minimal)

[maxime1992]

Yep I'm only half surprised as I think that most of the circular deps picked up by madge are circular deps handled by Typescript gracefully.

If there's a legit circular dep, you'd see it reported by Angular CLI and this surely could be source of errors. But this issue is probably related to something different

[yharaskrik]

Yes I believe you are right. It seemed odd to me that a circular Dep would cause is when typescript itself wasn't complaining about it.

[yharaskrik]

I am assuming this did not make it into the Nx v10 release?

[vsavkin]

Fix it over here: https://github.com/nrwl/nx/pull/3391. I'll cut a patch later today.

[vsavkin]

It has been fixed in 10.0.6. It'll also be a part of 9.6 release.

[yharaskrik]

Amazing thank you @vsavkin!

[yharaskrik]

@vsavkin wondering if there is a timeline on 9.6 release?