SyntaxError: strict mode code may not contain 'with' statements after 8 -> 9 upgrade (Hello World)

🐞 bug report

Affected Package

Not clear to me, the vendor.js link in the screenshot below points to `/node_modules/domino/lib/sloppy.js`

Is this a regression?

Yes, upgrades from 7->8 work fine. 8->8.x also work

Description

If I scaffold a Hello World application using `dotnet new angular -o my-new-app`, then I upgrade to Angular 9, I get the above error in the Console: `SyntaxError: strict mode code may not contain 'with' statements` and the Hello World page is stuck on `Loading...`

🔬 Minimal Reproduction

1. dotnet new angular -o my-new-app
2. cd my-new-app/ClientApp/
3. npm install
4. ng serve verify Hello World Angular 8 app works here
5. ng update @angular/core@8 @angular/cli@8
6. ng update @angular/cli @angular/core --next
7. ng serve Hello World does not work

I did the above instructions on this git repo, and you can run ng serve here: https://github.com/dmbaker90/Angular_9_bug

🔥 Exception or Error

🌍 Your Environment

Angular Version:

$ ng version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 9.0.0-rc.10
Node: 12.14.1
OS: win32 x64

Angular: 9.0.0-rc.11
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... platform-server, router
Ivy Workspace: Yes

Package                                    Version
--------------------------------------------------------------------
@angular-devkit/architect                  0.900.0-rc.10
@angular-devkit/build-angular              0.900.0-rc.10
@angular-devkit/build-optimizer            0.900.0-rc.10
@angular-devkit/build-webpack              0.900.0-rc.10
@angular-devkit/core                       9.0.0-rc.10
@angular-devkit/schematics                 9.0.0-rc.10
@angular/cli                               9.0.0-rc.10
@ngtools/webpack                           9.0.0-rc.10
@nguniversal/module-map-ngfactory-loader   8.1.1
@schematics/angular                        9.0.0-rc.10
@schematics/update                         0.900.0-rc.10
rxjs                                       6.5.3
typescript                                 3.7.5
webpack                                    4.41.2

Anything else relevant? It wasn’t clear to me if this was a dotnet issue or angular issue. ng new projects seem to work fine. However, I don’t see why the dotnet scaffolding would be related to npm package updates.

[alan-agius4]

Hi, I have looked at the repo and it seems that the root cause seems to be that your browser bundle is including domino which shouldn’t not happen.

The browser bundle is including @angular/platform-server which imports domino due to https://github.com/dmbaker90/Angular_9_bug/blob/a531d61134a4291d4af8305d9b9098fd97bcd117/my-new-app/ClientApp/src/main.ts#L22

That export was added with an Angular CLI version 9 migration, the reason for this is because the server main file is pointing to same one as the browser. Typically the server and browser builds have separate entrypoints because of different dependencies and are commonly named main.server.ts and main.ts. https://github.com/dmbaker90/Angular_9_bug/blob/a531d61134a4291d4af8305d9b9098fd97bcd117/my-new-app/ClientApp/angular.json#L97

It seems that there is a bug in scaffolding of the new application with dotnet templates. I also tried using NET Core 2.2 SDK version 2.2 (current latest) and it is still using Angular CLI version 6 (Which is no longer in LTS) to scaffold application.

Remove the below from your main.ts

export { renderModule, renderModuleFactory } from '@angular/platform-server';

If you are not using Angular universal you should also remove the server section in your angular.json, since it is incorrect and might cause future problems.

[Moalpima]

Jason Taylor wrote a very good article to this theme: https://jasontaylor.dev/asp-net-core-angular-9-upgrade/