Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Angular CLI locally generates by default the main.ts file without zone.js, which creates an error (NG0908) in StackBlitz #2366

Open
jprivet-dev opened this issue Feb 24, 2023 · 1 comment

Comments

@jprivet-dev
Copy link

jprivet-dev commented Feb 24, 2023

Hi!

Description of Bug

In my GitHub repository, Angular CLI locally generates by default the main.ts file without zone.js:

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));

Which creates an error (NG0908) when I launch the project in StackBlitz:

Error: NG0908: In this configuration Angular requires Zone.js

image

At this stage, locally everything works fine with $ ng serve.

So to solve the problem in StackBlitz, I have to import zone.js in main.ts:

import 'zone.js/dist/zone'; // Avoid error in StackBlitz
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));

After that, everything worked perfectly on StackBlitz:

image

But triggers a warning locally with $ ng serve:

Warning: .../angular-stackblitz/src/main.ts depends on 'zone.js/dist/zone'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Steps to Reproduce

  1. I generate locally a complete Angular project with a global Angular CLI 15.1.5 with the following command:
$ ng new app --directory ./ --skip-git true --routing --style scss --defaults --strict
  1. I save the generated application in my GitHub repository (https://github.com/jprivet-dev/angular-stackblitz).

  2. I launch the project in StackBlitz: https://stackblitz.com/github/jprivet-dev/angular-stackblitz/tree/main.

  3. I launch the project locally with $ ng serve.

Expected Behavior

I am looking for a single solution without zone.js, to make everything works, without errors and alerts, in StackBlitz and locally with $ ng serve.

Thank you in advance for your help 😊

@zjkipping
Copy link

zjkipping commented May 5, 2023

Ya.. this was changed in Angular. Polyfills are now done via the angular.json's polyfills build option property. You supply the zone.js polyfill there instead of via the TS polyfills file. This is a major bummer... Does stackblitz not really respect the angular.json configuration?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants