Angular-cli: UnhandledPromiseRejectionWarning: TypeError: Cannot destructure property `warnings` of 'undefined' or 'null'.

[JonWallsten]

🐞 Bug report

Command (mark with an x)

- [x ] build

Is this a regression?

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

Description

Whenever there's an error in a scss-file connected to a component, childCompilation becomes undefined and hence can't be destructed. err is provided. So I guess you just need handle the empty childCompilation case.

#angular-cli/packages/ngtools/webpack/src/resource_loader.ts:109
const { warnings, errors } = childCompilation;

🔬 Minimal Reproduction

https://github.com/JonWallsten/angular-bug
Step 1: npm i
Step 2: npm run build
Step 3: ...
Step 4: Profit!

🔥 Exception or Error

UnhandledPromiseRejectionWarning: TypeError: Cannot destructure property `warnings` of 'undefined' or 'null'.
    at childCompiler.compile (C:\Users\jway52\repo\angular-devkit-bug\node_modules\@ngtools\webpack\src\resource_loader.js:81:46)
    at compilation.seal.err (C:\Users\jway52\repo\angular-devkit-bug\node_modules\webpack\lib\Compiler.js:666:23)
    at hooks.additionalAssets.callAsync.err (C:\Users\jway52\repo\angular-devkit-bug\node_modules\webpack\lib\Compilation.js:1369:13)
    at _err0 (eval at create (C:\Users\jway52\repo\angular-devkit-bug\node_modules\tapable\lib\HookCodeFactory.js:33:10), :9:1)
    at _evaluate.then.catch.err (C:\Users\jway52\repo\angular-devkit-bug\node_modules\@ngtools\webpack\src\resource_loader.js:70:39)
    at process._tickCallback (internal/process/next_tick.js:68:7)

🌍 Your Environment

Angular CLI: 8.2.0
Node: 10.16.0
OS: win32 x64
Angular: 8.2.0
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.802.0
@angular-devkit/build-optimizer   0.802.0
@angular-devkit/core              8.2.0
@angular-devkit/schematics        8.2.0
@angular/cdk                      8.1.2
@angular/http                     8.0.0-beta.10
@angular/material                 8.1.2
@ngtools/webpack                  8.2.0
@schematics/angular               8.2.0
@schematics/update                0.802.0
rxjs                              6.5.2
typescript                        3.5.3
webpack                           4.39.1

[JonWallsten]

I just noticed this was fixed and committed 4 days ago.

[pouyaz123]

@JonWallsten do you know what in scss files might cause this issue? i only get this error when i try to build for angular universal 'npm run build:ssr'

[JonWallsten]

@JonWallsten do you know what in scss files might cause this issue? i only get this error when i try to build for angular universal 'npm run build:ssr'

@pouyaz123: Unfortunately it can be anything that the linter doesn't pick up. In my case it was : instead of ; and then multiple dots before the class.

The easiest way to check is to edit this file: node_modules/@ngtools/webpack/src/resource_loader.js and add the following code on the line before the error occurs:

if (err) { 
  reject(err);
  return;
}

For more info:
https://github.com/angular/angular-cli/pull/15244

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}