angular-cli icon indicating copy to clipboard operation
angular-cli copied to clipboard

incorrect detection of zoneless app

Open DibyodyutiMondal opened this issue 6 months ago • 2 comments

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

Including any js/ts file in the polyfills array causes the angular server to incorrectly identify the app as a non-zoneless app. Thus it tries to include zone.js, which is deleted, because I uninstall the package as per the guide.

Minimal Reproduction

Exception or Error


Your Environment

Angular CLI: 20.1.0
Node: 22.14.0
Package Manager: pnpm 10.13.1
OS: linux x64

Angular: 20.1.0
... animations, build, cdk, cli, common, compiler, compiler-cli
... core, forms, language-service, material
... material-luxon-adapter, platform-browser
... platform-browser-dynamic, platform-server, router, ssr

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.2001.0
@angular-devkit/build-angular   20.1.0
@angular-devkit/core            20.1.0
@angular-devkit/schematics      20.1.0
@schematics/angular             20.0.6
ng-packagr                      20.0.1
rxjs                            7.8.1
typescript                      5.8.3

Anything else relevant?

TLDR

This is essentially a re-open of #28898. Developers are forced to avoid adding any js/ts file to the polyfills array. Instead, they have to create js scripts inline inside index.html, or write js files, and include them as assets with index.html


The problem is within these lines: https://github.com/angular/angular-cli/blob/2c3a46b9ecf69049fbddb2c912636d9d62e197df/packages/angular/build/src/tools/esbuild/utils.ts#L469-L478

The presence of any js/ts file in the polyfills array causes zone to be included, even though I uninstalled zone.js and do everything zone-less-ly.

I had a file called polyfill-buffer.ts which I used to add to the polyfill array:

import { Buffer } from 'buffer';

if (!globalThis.Buffer) {
  Object.assign(globalThis, { Buffer });
}

Now I have to add it to index.html as a script

import { Buffer } from 'https://cdn.jsdelivr.net/npm/buffer/+esm';

if (!globalThis.Buffer) {
  Object.assign(globalThis, { Buffer });
}

This is maintainable for small scripts like these. But it eliminates the possibility of using any file-based polyfill stuff.

DibyodyutiMondal avatar Jul 10 '25 00:07 DibyodyutiMondal

Any insight into what the team thinks about this?

Also, I wonder if creating a local workspace package will be a plausible workaround. But it would be annoying to create an entire package for small things

DibyodyutiMondal avatar Oct 22 '25 22:10 DibyodyutiMondal

I faced the same problem.

odomanskyi avatar Nov 25 '25 09:11 odomanskyi