Error during compilation after fixing a syntax error

[DeborahK]

🐞 bug report

Affected Package

None

Is this a regression?

Yes, the previous version in which this bug was not present was: 8.2.7

Description

If I have a syntax error in the code, *then* start the app with `npm start`, when I fix the error, the compiler generates the following error:

ERROR in ./src/main.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
Error: C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\src\main.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property. 
    at AngularCompilerPlugin.getCompiledFile (C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:920:23)
    at plugin.done.then (C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\node_modules\@ngtools\webpack\src\loader.js:41:31)
    at process._tickCallback (internal/process/next_tick.js:68:7)
ERROR in ./src/polyfills.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
Error: C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\src\polyfills.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
    at AngularCompilerPlugin.getCompiledFile (C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:920:23)
    at plugin.done.then (C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\node_modules\@ngtools\webpack\src\loader.js:41:31)
    at process._tickCallback (internal/process/next_tick.js:68:7)

🔬 Minimal Reproduction

This has been somewhat difficult to reproduce.

This is what I did, and can reproduce it every time following these steps.

1. Made a syntax error in my code

    ngOnInit() {
        this.sub = this.productService.selectedProductChanges$.subscribe({
            next: selectedProduct => this.product = selectedProduct,
            error: err => this.errorMessage = err
        };     // <- Missing paren here
    }

2. Started the app with npm start

3. I see the correct ')' expected error message

4. Fixed the error, got the error message as shown below.

5. At this point I have to stop the compiler and restart, then it compiles without issue.

Here is the output from the console:

PS C:\Users\...> npm start

> apm@0.0.0 start C:\Users\...
> ng serve -o

10% building 3/3 modules 0 activei ｢wds｣: Project is running at http://localhost:4200/webpack-dev-server/
i ｢wds｣: webpack output is served from /
i ｢wds｣: 404s will fallback to //index.html

chunk {main} main.js, main.js.map (main) 2.07 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 714 bytes [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.15 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 1.04 MB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 339 kB [initial] [rendered]
Date: 2019-11-01T23:24:46.037Z - Hash: 9acd019b2df6dfe09939 - Time: 2676ms

ERROR in src/app/products/product-shell/product-shell-detail.component.ts:23:10 - error TS1005: ')' expected.

23         };
            ~

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
i ｢wdm｣: Failed to compile.
i ｢wdm｣: Compiling...

Date: 2019-11-01T23:24:55.928Z - Hash: 44abf69c38b2e0c5ade5
3 unchanged chunks
chunk {main} main.js, main.js.map (main) 2.78 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 1.42 kB [initial] [rendered]
Time: 331ms

ERROR in ./src/main.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
Error: C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\src\main.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property. 
    at AngularCompilerPlugin.getCompiledFile (C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:920:23)
    at plugin.done.then (C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\node_modules\@ngtools\webpack\src\loader.js:41:31)
    at process._tickCallback (internal/process/next_tick.js:68:7)
ERROR in ./src/polyfills.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
Error: C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\src\polyfills.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
    at AngularCompilerPlugin.getCompiledFile (C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:920:23)
    at plugin.done.then (C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\node_modules\@ngtools\webpack\src\loader.js:41:31)
    at process._tickCallback (internal/process/next_tick.js:68:7)
i ｢wdm｣: Failed to compile.

If you want to try out the same code I'm using, you can find it here: https://github.com/DeborahK/Angular-Communication/tree/master/APM-Final%20v8

You'll need to update it to v9 using these steps:

npm install --no-save @angular/cli@next
ng update @angular/cli @angular/core --next

🔥 Exception or Error

ERROR in ./src/main.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
Error: C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\src\main.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property. 
    at AngularCompilerPlugin.getCompiledFile (C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:920:23)
    at plugin.done.then (C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\node_modules\@ngtools\webpack\src\loader.js:41:31)
    at process._tickCallback (internal/process/next_tick.js:68:7)
ERROR in ./src/polyfills.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
Error: C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\src\polyfills.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
    at AngularCompilerPlugin.getCompiledFile (C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:920:23)
    at plugin.done.then (C:\Users\Deborah\Documents\GitHub\Angular-Communication\APM-Final v8\node_modules\@ngtools\webpack\src\loader.js:41:31)
    at process._tickCallback (internal/process/next_tick.js:68:7)
i ｢wdm｣: Failed to compile.

🌍 Your Environment

Angular Version:

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.0
@angular-devkit/build-angular     0.900.0-rc.0
@angular-devkit/build-optimizer   0.900.0-rc.0
@angular-devkit/build-webpack     0.900.0-rc.0
@angular-devkit/core              9.0.0-rc.0
@angular-devkit/schematics        9.0.0-rc.0
@ngtools/webpack                  9.0.0-rc.0
@schematics/angular               9.0.0-rc.0
@schematics/update                0.900.0-rc.0
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Anything else relevant?

@StephenFluin @alan-agius4

[filipesilva]

I think this might be a mix of angular/angular#32214 and angular/angular#32213.