Unexpected 9MB binary produced from `@angular-eslint/schematics`: `.nx/cache/18.3.3-nx.linux-x64-gnu.node` about angular-eslint HOT 25 CLOSED

Nx 19.0.4 has been released, which is what the new angular-eslint 17.4.1 depends on (as long you refresh your dependencies), so you will no longer see the native file in your angular-eslint workspaces as long as you are using that latest version.

Thanks all, and sorry for the confusion!

from angular-eslint.

Same here. With @angular-eslint 17.3.0 the nx/devkit/nwl dependencies find their way into the project. Even breaks my build process Error: Cannot find module '@nx/nx-linux-x64-gnu'. Why are they suddenly required by @angular-eslint?

from angular-eslint.

@johnnygerard

Is the .nx/cache/ directory and its contents required or is it a build artifact that can be deleted?

Right now, it will be repopulated if you delete it, so per my previous message the recommended action is to git ignore it. Once nrwl/nx#23375 is released, it will stay deleted once you remove it.

from angular-eslint.

@jonasduever Exactly, you had .node files in there you didn't realize already. It was definitely a mistake for nx to start caching the .node within the workspace source, and we are addressing that ASAP with the above linked PR, so it will go back to being an invisible implementation detail.

I think most build tools can be kept as a dev dependency and are not actually used in the distributed package. I hoped that this was possible with angular-eslint + nx as well, but it seems that it's too much integrated into the application.

angular-eslint is still also a dev dependency and a devtool, it is not involved in your Angular application at all

Will try this again in the next sprint, to be 100% sure. I'm pretty sure I did several completely fresh installs (no node_modules, no package-lock.json) when testing this. But maybe I messed up something. 🤞

Please open a fresh issue focused on your case if you run into any more issues and we will figure out it together!

from angular-eslint.

I think eslint should add .nx to .gitignore

from angular-eslint.

I also have this file after running ng update @angular/core@17 @angular/cli@17 @angular-eslint/schematics@17. We are not using nx in our project and I'm therefore surprised this is needed!

Shouldn't nx be a dev or peerDependency of angular-eslint?

from angular-eslint.

same here

from angular-eslint.

@tyzess they were removed but then added again (see #1142 (comment) )
I too would like to remove the dependency on nx (in the comment I offered to work on a PR in that direction).

from angular-eslint.

Con confirm this and it is a little bit annoying because it adds this binary and breaks CI (same error as @tyzess). There are possible workarounds for all of this, but I don't really like adding them (temporarily?) for a dev dependency.
Will downgrade to v17.2.1 for now.

from angular-eslint.

Hi Folks, being able to leverage @nx/devkit gives me a greatly improved developer experience for building @angular-eslint/schematics and @angular-eslint/builder.

For maximum speed and efficiency the internals of Nx are written in rust, so the native code is referenced via that .node file. It used to be placed inside the node_modules so you never saw it, now it lives in the .nx directory. I can understand why it seems unexpected to have that directory in an Angular workspace that isn't leveraging Nx directly, so please leave this with me and I'll discuss with the Nx team and get back to you on here.

For now, gitignoring the directory is the expected solution. Not being able to find the file is definitely unexpected @tyzess @jonasduever - is the file missing from your package-lock.json (or equivalent)?

Many thanks!

from angular-eslint.

@JamesHenry Thanks for your feedback!
My guess would be the different OS/architecture.
In my case:

• Development machine: Windows
• Azure DevOps Pipeline: Linux
• In package-lock.json, there is only @nx/nx-win32-x64-msvc but no @nx/nx-linux-x64-gnu - probably because it's in optionalDependencies of nx?
• Azure DevOps Pipeline task (Npm@1) runs npm ci → Error

npm ERR! code 1
npm ERR! path /home/vsts/work/1/s/frontend/node_modules/nx
npm ERR! command failed
npm ERR! command sh -c node ./bin/post-install
npm ERR! /home/vsts/work/1/s/frontend/node_modules/nx/src/native/native-bindings.js:244
npm ERR!     throw loadError
npm ERR!     ^
npm ERR! 
npm ERR! Error: Cannot find module '@nx/nx-linux-x64-gnu'
npm ERR! Require stack:
npm ERR! - /home/vsts/work/1/s/frontend/node_modules/nx/src/native/index.js
npm ERR! - /home/vsts/work/1/s/frontend/node_modules/nx/src/hasher/node-task-hasher-impl.js
npm ERR! - /home/vsts/work/1/s/frontend/node_modules/nx/src/hasher/task-hasher.js
npm ERR! - /home/vsts/work/1/s/frontend/node_modules/nx/src/hasher/hash-task.js
npm ERR! - /home/vsts/work/1/s/frontend/node_modules/nx/src/tasks-runner/run-command.js
npm ERR! - /home/vsts/work/1/s/frontend/node_modules/nx/src/nx-cloud/utilities/get-cloud-options.js
npm ERR! - /home/vsts/work/1/s/frontend/node_modules/nx/bin/post-install.js
npm ERR!     at Module._resolveFilename (node:internal/modules/cjs/loader:1143:15)
npm ERR!     at Function.resolve (node:internal/modules/helpers:190:19)
npm ERR!     at Module._load (/home/vsts/work/1/s/frontend/node_modules/nx/src/native/index.js:53:36)
npm ERR!     at Module.require (node:internal/modules/cjs/loader:1231:19)
npm ERR!     at require (node:internal/modules/helpers:179:18)
npm ERR!     at Object.<anonymous> (/home/vsts/work/1/s/frontend/node_modules/nx/src/native/native-bindings.js:184:31)
npm ERR!     at Module._compile (node:internal/modules/cjs/loader:1369:14)
npm ERR!     at Module._extensions..js (node:internal/modules/cjs/loader:1427:10)
npm ERR!     at Module.load (node:internal/modules/cjs/loader:1206:32)
npm ERR!     at Module._load (node:internal/modules/cjs/loader:1022:12) {
npm ERR!   code: 'MODULE_NOT_FOUND',
npm ERR!   requireStack: [
npm ERR!     '/home/vsts/work/1/s/frontend/node_modules/nx/src/native/index.js',
npm ERR!     '/home/vsts/work/1/s/frontend/node_modules/nx/src/hasher/node-task-hasher-impl.js',
npm ERR!     '/home/vsts/work/1/s/frontend/node_modules/nx/src/hasher/task-hasher.js',
npm ERR!     '/home/vsts/work/1/s/frontend/node_modules/nx/src/hasher/hash-task.js',
npm ERR!     '/home/vsts/work/1/s/frontend/node_modules/nx/src/tasks-runner/run-command.js',
npm ERR!     '/home/vsts/work/1/s/frontend/node_modules/nx/src/nx-cloud/utilities/get-cloud-options.js',
npm ERR!     '/home/vsts/work/1/s/frontend/node_modules/nx/bin/post-install.js'
npm ERR!   ]
npm ERR! }
npm ERR! 
npm ERR! Node.js v20.12.2

from angular-eslint.

@JamesHenry Is the .nx/cache/ directory and its contents required or is it a build artifact that can be deleted?

from angular-eslint.

Hi Folks, being able to leverage @nx/devkit gives me a greatly improved developer experience for building @angular-eslint/schematics and @angular-eslint/builder.

Would it be possible to restrict the usage of nx to the building (i.e. avoid using it at runtime)?
AFAICT at runtime angular-eslint might be able to work with @nx/devkit (and without nx).
That could provide a convenient DX while still reducing the issues of package dependencies.

For maximum speed and efficiency the internals of Nx are written in rust, so the native code is referenced via that .node file. It used to be placed inside the node_modules so you never saw it, now it lives in the .nx directory. I can understand why it seems unexpected to have that directory in an Angular workspace that isn't leveraging Nx directly, so please leave this with me and I'll discuss with the Nx team and get back to you on here.

Another issue I pointed out regarding nx is that it pulls in several other dependencies, which are sometimes not well supported in some environments (for example I mentioned that my team was hitting some unexpected issues because nx pulled in @parcel/[email protected], which did not provide pre-build packages for arm64).
The dependencies pulled in from @nx/devkit are fewer and hopefully more well-behaved :)

EDIT: apparently @nx/devkit has nx as peer dependency 😢

from angular-eslint.

I tried and wrote #1815 that preserves nx for building/testing the packages (very convenient, especially for fast iteration) but removes its uses from within the packages.

from angular-eslint.

@ranma42 Sorry to hear about past issues, although @parcel/watcher has not been used by Nx for quite some time and there are no known issues with dependencies missing native distributions.

This current issue of a tracked native file appearing in the workspace is being addressed in two ways:

• I will be releasing a patch of angular-eslint powered by #1816 which will apply the relevant gitignore config automatically on ng add for this temporary situation where the native file is placed in the workspace
• Per my discussion with the Nx team, we are updating it so that it no longer puts the native file there nrwl/nx#23375

It has become a very common practice in the JS tooling space to lean on Rust or other native code for performance reasons, if you browse your node_modules you will likely find other .node files from other tools, particularly compilers, bundlers, task runners etc.

For anyone running into this in existing workspaces until nrwl/nx#23375 is released, the recommended course of action is to add .nx/cache and .nx/workspace-data to your .gitignore file. (Again this will be redundant once nrwl/nx#23375 is released)

from angular-eslint.

@jonasduever

This should hopefully just be a matter of regenerating your lock file, you should then see all the native references in there.

from angular-eslint.

Update to #1784 (comment):

angular-eslint 17.4.1 is out now which, when running ng add, adds the relevant gitignore entries for the native file in its current temporary location within the workspace

from angular-eslint.

if you browse your node_modules you will likely find other .node files from other tools, particularly compilers, bundlers, task runners etc.

In this pretty large Angular application, I only found one *.node file (rollup from @angular-devkit/build-angular -> vite).

I think most build tools can be kept as a dev dependency and are not actually used in the distributed package. I hoped that this was possible with angular-eslint + nx as well, but it seems that it's too much integrated into the application.

This should hopefully just be a matter of regenerating your lock file, you should then see all the native references in there.

Will try this again in the next sprint, to be 100% sure. I'm pretty sure I did several completely fresh installs (no node_modules, no package-lock.json) when testing this. But maybe I messed up something. 🤞

@tyzess Did you solve this issue on your end in the meantime?

from angular-eslint.

@JamesHenry if have installed the latest versions but yet if I run ng lint they create a nx folder.

How I can fix it?

from angular-eslint.

@JamesHenry if have installed the latest versions but yet if I run ng lint they create a nx folder.

How I can fix it?

You should add .nx folder to the .gitignore

from angular-eslint.

@dertuerke check your lock file, it suggests you are still pulling in an older version of nx. For the most basic solution you could delete the lock file and regenerate it

from angular-eslint.

I don’t use nx 🙈

from angular-eslint.

@dertuerke That's fine, as outlined on this thread, angular-eslint uses Nx in its implementation details. It's the same as all your other dependencies - they have dependencies themselves.

All those dependencies and dependencies of dependencies are specified in your lock file, and sometimes the lock file can pin dependencies of dependencies to older versions.

Please kindly try regenerating the lock file and it should fix your issue

from angular-eslint.

i use pnpm and if i force reinstall i get the nx folder back:

pnpm install --force
 WARN  using --force I sure hope you know what you are doing
Downloading @angular/[email protected]: 6.66 MB/6.66 MB, done
 WARN  2 deprecated subdependencies found: [email protected], [email protected]
Packages: +1154
Progress: resolved 1151, reused 1024, downloaded 127, added 1154, done
node_modules/.pnpm/[email protected]/node_modules/nx: Running postinstall script, done in 313ms

from angular-eslint.

@dertuerke I just did the following:

Create pnpm powered Angular CLI v17 workspace:

 pnpm dlx @angular/cli@17 new --package-manager pnpm
 WARN  1 deprecated subdependencies found: [email protected]
Packages: +224
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Progress: resolved 224, reused 224, downloaded 0, added 224, done
? What name would you like to use for the new workspace and initial project? ngseventeenpnpm
? Which stylesheet format would you like to use? CSS             [ https://developer.mozilla.org/docs/Web/CSS                     ]
? Do you want to enable Server-Side Rendering (SSR) and Static Site Generation (SSG/Prerendering)? No
CREATE ngseventeenpnpm/README.md (1069 bytes)
CREATE ngseventeenpnpm/.editorconfig (274 bytes)
CREATE ngseventeenpnpm/.gitignore (587 bytes)
CREATE ngseventeenpnpm/angular.json (2682 bytes)
CREATE ngseventeenpnpm/package.json (1046 bytes)
CREATE ngseventeenpnpm/tsconfig.json (857 bytes)
CREATE ngseventeenpnpm/tsconfig.app.json (263 bytes)
CREATE ngseventeenpnpm/tsconfig.spec.json (273 bytes)
CREATE ngseventeenpnpm/.vscode/extensions.json (130 bytes)
CREATE ngseventeenpnpm/.vscode/launch.json (470 bytes)
CREATE ngseventeenpnpm/.vscode/tasks.json (938 bytes)
CREATE ngseventeenpnpm/src/main.ts (250 bytes)
CREATE ngseventeenpnpm/src/favicon.ico (15086 bytes)
CREATE ngseventeenpnpm/src/index.html (301 bytes)
CREATE ngseventeenpnpm/src/styles.css (80 bytes)
CREATE ngseventeenpnpm/src/app/app.component.css (0 bytes)
CREATE ngseventeenpnpm/src/app/app.component.html (19903 bytes)
CREATE ngseventeenpnpm/src/app/app.component.spec.ts (943 bytes)
CREATE ngseventeenpnpm/src/app/app.component.ts (311 bytes)
CREATE ngseventeenpnpm/src/app/app.config.ts (227 bytes)
CREATE ngseventeenpnpm/src/app/app.routes.ts (77 bytes)
CREATE ngseventeenpnpm/src/assets/.gitkeep (0 bytes)
✔ Packages installed successfully.
    Successfully initialized git.

Add @angular-eslint/schematics v17

❯ pnpm exec ng add @angular-eslint/schematics
ℹ Using package manager: pnpm
✔ Found compatible package version: @angular-eslint/[email protected].
✔ Package information loaded.

The package @angular-eslint/[email protected] will be installed and executed.
Would you like to proceed? Yes
✔ Packages successfully installed.
    
    All @angular-eslint dependencies have been successfully installed 🎉
    
    Please see https://github.com/angular-eslint/angular-eslint for how to add ESLint configuration to your project.
    
    We detected that you have a single project in your workspace and no existing linter wired up, so we are configuring ESLint for you automatically.
    
    Please see https://github.com/angular-eslint/angular-eslint for more information.
    
CREATE .eslintrc.json (991 bytes)
UPDATE package.json (1423 bytes)
UPDATE angular.json (2978 bytes)
UPDATE .gitignore (617 bytes)
✔ Packages installed successfully.

Run commands such as linting, project generation:

❯ ng lint                                                                                                                                                                                                                                                                        17s

Linting "ngseventeenpnpm"...

All files pass linting.


~/Repos/tmp/ngseventeenpnpm   ⬢  20.12.1                                                                                                                                                                                                                                       main
❯ ng g lib libby 
CREATE projects/libby/README.md (971 bytes)
CREATE projects/libby/ng-package.json (154 bytes)
CREATE projects/libby/package.json (209 bytes)
CREATE projects/libby/tsconfig.lib.json (314 bytes)
CREATE projects/libby/tsconfig.lib.prod.json (240 bytes)
CREATE projects/libby/tsconfig.spec.json (273 bytes)
CREATE projects/libby/src/public-api.ts (115 bytes)
CREATE projects/libby/src/lib/libby.component.spec.ts (589 bytes)
CREATE projects/libby/src/lib/libby.component.ts (221 bytes)
CREATE projects/libby/src/lib/libby.service.spec.ts (352 bytes)
CREATE projects/libby/src/lib/libby.service.ts (134 bytes)
CREATE projects/libby/.eslintrc.json (645 bytes)
UPDATE angular.json (4176 bytes)
UPDATE package.json (1452 bytes)
UPDATE tsconfig.json (927 bytes)

Check if there is a .nx directory:

❯ ls -ls .nx
ls: .nx: No such file or directory

So there must be something specific about your workspace. Your package.json, you lock file... one or both must contain some extra references to older versions or other things that are unexpected.

Feel free to open a fresh issue if you can reproduce by adjusting the steps I performed above.

This issue based on the OP is definitely resolved for the common case, so I am going to lock this one to avoid further comments on a closed issues.

Again, do feel free to open fresh issues that are specific to your circumstances and your repo if you are still having issues.

Please ensure you are using the latest version of Angular ESLint v17, or the imminent v18 before doing so, however

Thanks all!

from angular-eslint.