Skip to content

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

@jprivet-dev

Description

@jprivet-dev

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 😊

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions