Angular never searches for zone.js in the correct path

Open
#27,473 8 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
4/5
Estimated time
3-5 days
Newbie friendliness
35/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Stale
Tech stack
angular, typescript
Domain
build-system, cli

Research direction

Reproduce the failure in the linked repository with pnpm install followed by npm start. Start by reading the workspace package.json and tsconfig.app.json, then follow the angular:polyfills-server import of zone.js/node. Done means the build resolves zone.js from the workspace's node_modules instead of only checking the monorepo root or workspace source path.

Written by the indexing model from the issue text.

Description

angular/build:application area: @angular/build type: bug/fix
Command

build

Is this a regression?
  • Yes, this behavior used to work in the previous version
The previous version in which this bug was not present was

No response

Description

I have a monorepo, one of its workspaces is an Angular workspace. and I use pnpm to install the dependencies
each workspace has its own node_modules folder.

when I start building this app (the Angular workspace), it fails to find zone.js
it should find it inside node_modules of the Angular app

this debug info may be useful
as you can see it looks in:

  • dibo/node_modules/zone.js (the monorepo's top-level root)
  • dibo/apps/mobarmegeen/mobarmegeen-ui/zone.js

but never looks in the correct path which is dibo/apps/mobarmegeen/mobarmegeen-ui/node_modules/zone.js

debug info 
 [DEBUG] Resolving import "zone.js/node" in directory "/home/dibo/dev/@its-dibo/dibo" of type "import-statement"

  Checking for package alias matches
    Failed to find any package alias matches
  Read 25 entries for directory "/"
  Read 1 entry for directory "/home"
  Read 25 entries for directory "/home/dibo"
  Read 4 entries for directory "/home/dibo/dev"
  Read 3 entries for directory "/home/dibo/dev/@its-dibo"
  The file "/home/dibo/dev/@its-dibo/dibo/package.json" exists
  Read 40 entries for directory "/home/dibo/dev/@its-dibo/dibo"
  Read 40 entries for directory "/home/dibo/dev/@its-dibo/dibo"
  Searching for "zone.js/node" in "node_modules" directories starting from "/home/dibo/dev/@its-dibo/dibo"
    Matching "zone.js/node" against "paths" in
  "/home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen/mobarmegeen-ui/tsconfig.app.json"
      Using "/home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen/mobarmegeen-ui" as "baseURL"
    Attempting to load "/home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen/mobarmegeen-ui/zone.js/node" as a file
      Failed to read directory "/home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen/mobarmegeen-ui/zone.js": open
  /home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen/mobarmegeen-ui/zone.js: no such file or directory
    Attempting to load "/home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen/mobarmegeen-ui/zone.js/node" as a directory
      Read 40 entries for directory "/home/dibo/dev/@its-dibo/dibo"
      Read 2 entries for directory "/home/dibo/dev/@its-dibo/dibo/apps"
      Read 2 entries for directory "/home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen"
      The file "/home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen/mobarmegeen-ui/package.json" exists
      Read 16 entries for directory "/home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen/mobarmegeen-ui"
      Failed to read directory "/home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen/mobarmegeen-ui/zone.js": open
  /home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen/mobarmegeen-ui/zone.js: no such file or directory
      Failed to read directory "/home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen/mobarmegeen-ui/zone.js"
      Failed to read directory "/home/dibo/dev/@its-dibo/dibo/apps/mobarmegeen/mobarmegeen-ui/zone.js/node"
    Parsed package name "zone.js" and package subpath "./node"
    Checking for a package in the directory "/home/dibo/dev/@its-dibo/dibo/node_modules/zone.js/node"
    Read 40 entries for directory "/home/dibo/dev/@its-dibo/dibo"
    Read 76 entries for directory "/home/dibo/dev/@its-dibo/dibo/node_modules"
    Failed to read directory "/home/dibo/dev/@its-dibo/dibo/node_modules/zone.js": open
  /home/dibo/dev/@its-dibo/dibo/node_modules/zone.js: no such file or directory
    Failed to read directory "/home/dibo/dev/@its-dibo/dibo/node_modules/zone.js"
    Attempting to load "/home/dibo/dev/@its-dibo/dibo/node_modules/zone.js/node" as a file
      Failed to read directory "/home/dibo/dev/@its-dibo/dibo/node_modules/zone.js": open
  /home/dibo/dev/@its-dibo/dibo/node_modules/zone.js: no such file or directory
    Attempting to load "/home/dibo/dev/@its-dibo/dibo/node_modules/zone.js/node" as a directory
      Failed to read directory "/home/dibo/dev/@its-dibo/dibo/node_modules/zone.js"
      Failed to read directory "/home/dibo/dev/@its-dibo/dibo/node_modules/zone.js/node"

✘ [ERROR] Could not resolve "zone.js/node"

    angular:polyfills-server:angular:polyfills-server:1:7:
      1 │ import 'zone.js/node';
        ╵        ~~~~~~~~~~~~~~

  You can mark the path "zone.js/node" as external to exclude it from the bundle, which will remove
  this error and leave the unresolved path in the bundle.
Minimal Reproduction

https://github.com/its-dibo/issue-zonejs

1- install via pnpm pnpm install
if pnpm is not installed, simply, run npm I -g pnpm

2- run the app npm start

note: don't use any other package manager, as they hoist the packages of the app to the root of the monorepo.
.

Exception or Error

No response

Your Environment
Angular CLI: 17.0.3
Node: 20.10.0
Package Manager: yarn 1.22.22
OS: linux x64

Angular: undefined
... 

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.1700.3 (cli-only)
@angular-devkit/core         17.0.3 (cli-only)
@angular-devkit/schematics   17.0.3 (cli-only)
@schematics/angular          17.0.3 (cli-only)
rxjs
Dominant language
TypeScript
Stars
27k
Forks
11.8k
Avg merge
16h 35m
Merged PRs (30d)
176

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from angular/angular-cli

All issues in angular/angular-cli

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.