From 3504c43e48d8e265ca0943005f3cea2d25290cbd Mon Sep 17 00:00:00 2001
From: Charles Lyding <19598772+clydin@users.noreply.github.com>
Date: Tue, 16 Mar 2021 12:36:31 -0400
Subject: [PATCH] fix(@ngtools/webpack): remove Webpack 5 deprecation warning
 in resource loader

This change adds support for using the Webpack `processAssets` hook to handle the resource loader child compilation's assets. This new hook is the recommended way to process assets in Webpack 5+.
---
 .../ngtools/webpack/src/resource_loader.ts    | 25 ++++++++++++++-----
 1 file changed, 19 insertions(+), 6 deletions(-)

diff --git a/packages/ngtools/webpack/src/resource_loader.ts b/packages/ngtools/webpack/src/resource_loader.ts
index 8d0d22768d33..f42f75df2c77 100644
--- a/packages/ngtools/webpack/src/resource_loader.ts
+++ b/packages/ngtools/webpack/src/resource_loader.ts
@@ -9,6 +9,7 @@ import * as vm from 'vm';
 import { Compiler, compilation } from 'webpack';
 import { RawSource } from 'webpack-sources';
 import { normalizePath } from './ivy/paths';
+import { isWebpackFiveOrHigher } from './webpack-version';
 
 const NodeTemplatePlugin = require('webpack/lib/node/NodeTemplatePlugin');
 const NodeTargetPlugin = require('webpack/lib/node/NodeTargetPlugin');
@@ -132,13 +133,25 @@ export class WebpackResourceLoader {
 
     let finalContent: string | undefined;
     let finalMap: string | undefined;
-    childCompiler.hooks.afterCompile.tap('angular-compiler', (childCompilation) => {
-      finalContent = childCompilation.assets[filePath]?.source().toString();
-      finalMap = childCompilation.assets[filePath + '.map']?.source().toString();
+    if (isWebpackFiveOrHigher()) {
+      childCompiler.hooks.compilation.tap('angular-compiler', (childCompilation) => {
+        childCompilation.hooks.processAssets.tap('angular-compiler', () => {
+          finalContent = childCompilation.assets[filePath]?.source().toString();
+          finalMap = childCompilation.assets[filePath + '.map']?.source().toString();
+
+          delete childCompilation.assets[filePath];
+          delete childCompilation.assets[filePath + '.map'];
+        });
+      });
+    } else {
+      childCompiler.hooks.afterCompile.tap('angular-compiler', (childCompilation) => {
+        finalContent = childCompilation.assets[filePath]?.source().toString();
+        finalMap = childCompilation.assets[filePath + '.map']?.source().toString();
 
-      delete childCompilation.assets[filePath];
-      delete childCompilation.assets[filePath + '.map'];
-    });
+        delete childCompilation.assets[filePath];
+        delete childCompilation.assets[filePath + '.map'];
+      });
+    }
 
     return new Promise<CompilationOutput>((resolve, reject) => {
       childCompiler.runAsChild((error, _, childCompilation) => {