refactor(@angular-devkit/build-angular): clean up webpack configurations

With this change we remove the worker and typescript configuration.

Author: alan-agius4

packages/angular_devkit/build_angular/src/builders/browser/index.ts

@@ -44,13 +44,7 @@ import {
   getIndexInputFile,
   getIndexOutputFile,
 } from '../../utils/webpack-browser-config';
-import {
-  getAnalyticsConfig,
-  getCommonConfig,
-  getStylesConfig,
-  getTypeScriptConfig,
-  getWorkerConfig,
-} from '../../webpack/configs';
+import { getAnalyticsConfig, getCommonConfig, getStylesConfig } from '../../webpack/configs';
 import { markAsyncChunksNonInitial } from '../../webpack/utils/async-chunks';
 import { normalizeExtraEntryPoints } from '../../webpack/utils/helpers';
 import {
@@ -96,8 +90,6 @@ async function initialize(
       getCommonConfig(wco),
       getStylesConfig(wco),
       getAnalyticsConfig(wco, context),
-      getTypeScriptConfig(wco),
-      wco.buildOptions.webWorkerTsConfig ? getWorkerConfig(wco) : {},
     ]);
 
   // Validate asset option values if processed directly

packages/angular_devkit/build_angular/src/builders/dev-server/index.ts

@@ -38,8 +38,6 @@ import {
   getCommonConfig,
   getDevServerConfig,
   getStylesConfig,
-  getTypeScriptConfig,
-  getWorkerConfig,
 } from '../../webpack/configs';
 import { IndexHtmlWebpackPlugin } from '../../webpack/plugins/index-html-webpack-plugin';
 import { createWebpackLoggingCallback } from '../../webpack/utils/stats';
@@ -167,8 +165,6 @@ export function serveWebpackBrowser(
         getCommonConfig(wco),
         getStylesConfig(wco),
         getAnalyticsConfig(wco, context),
-        getTypeScriptConfig(wco),
-        browserOptions.webWorkerTsConfig ? getWorkerConfig(wco) : {},
       ],
       options,
     );

packages/angular_devkit/build_angular/src/builders/extract-i18n/index.ts

@@ -13,13 +13,13 @@ import type { ɵParsedMessage as LocalizeMessage } from '@angular/localize';
 import type { Diagnostics } from '@angular/localize/tools';
 import * as fs from 'fs';
 import * as path from 'path';
-import webpack from 'webpack';
+import webpack, { Configuration } from 'webpack';
 import { ExecutionTransformer } from '../../transforms';
 import { createI18nOptions } from '../../utils/i18n-options';
 import { loadEsmModule } from '../../utils/load-esm';
 import { assertCompatibleAngularVersion } from '../../utils/version';
 import { generateBrowserWebpackConfigFromContext } from '../../utils/webpack-browser-config';
-import { getCommonConfig, getTypeScriptConfig, getWorkerConfig } from '../../webpack/configs';
+import { getCommonConfig } from '../../webpack/configs';
 import { createWebpackLoggingCallback } from '../../webpack/utils/stats';
 import { Schema as BrowserBuilderOptions, OutputHashing } from '../browser/schema';
 import { Format, Schema } from './schema';
@@ -195,11 +195,9 @@ export async function execute(
       // Default value for legacy message ids is currently true
       useLegacyIds = wco.tsConfig.options.enableI18nLegacyMessageIdFormat ?? true;
 
-      const partials = [
+      const partials: (Promise<Configuration> | Configuration)[] = [
         { plugins: [new NoEmitPlugin()] },
         getCommonConfig(wco),
-        getTypeScriptConfig(wco),
-        getWorkerConfig(wco),
       ];
 
       // Add Ivy application file extractor support

packages/angular_devkit/build_angular/src/builders/karma/index.ts

@@ -16,12 +16,7 @@ import { Configuration } from 'webpack';
 import { ExecutionTransformer } from '../../transforms';
 import { assertCompatibleAngularVersion } from '../../utils/version';
 import { generateBrowserWebpackConfigFromContext } from '../../utils/webpack-browser-config';
-import {
-  getCommonConfig,
-  getStylesConfig,
-  getTypeScriptConfig,
-  getWorkerConfig,
-} from '../../webpack/configs';
+import { getCommonConfig, getStylesConfig } from '../../webpack/configs';
 import { SingleTestTransformLoader } from '../../webpack/plugins/single-test-transform';
 import { Schema as BrowserBuilderOptions, OutputHashing } from '../browser/schema';
 import { findTests } from './find-tests';
@@ -59,12 +54,7 @@ async function initialize(
       watch: true,
     },
     context,
-    (wco) => [
-      getCommonConfig(wco),
-      getStylesConfig(wco),
-      getTypeScriptConfig(wco),
-      getWorkerConfig(wco),
-    ],
+    (wco) => [getCommonConfig(wco), getStylesConfig(wco)],
   );
 
   const karma = await import('karma');

packages/angular_devkit/build_angular/src/builders/server/index.ts

@@ -21,7 +21,7 @@ import { I18nOptions } from '../../utils/i18n-options';
 import { ensureOutputPaths } from '../../utils/output-paths';
 import { assertCompatibleAngularVersion } from '../../utils/version';
 import { generateI18nBrowserWebpackConfigFromContext } from '../../utils/webpack-browser-config';
-import { getCommonConfig, getStylesConfig, getTypeScriptConfig } from '../../webpack/configs';
+import { getCommonConfig, getStylesConfig } from '../../webpack/configs';
 import { webpackStatsLogger } from '../../webpack/utils/stats';
 import { Schema as ServerBuilderOptions } from './schema';
 
@@ -155,7 +155,7 @@ async function initialize(
       platform: 'server',
     } as NormalizedBrowserBuilderSchema,
     context,
-    (wco) => [getCommonConfig(wco), getStylesConfig(wco), getTypeScriptConfig(wco)],
+    (wco) => [getCommonConfig(wco), getStylesConfig(wco)],
   );
 
   let transformedConfig;

packages/angular_devkit/build_angular/src/webpack/configs/common.ts

@@ -6,6 +6,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
+import { AngularWebpackLoaderPath } from '@ngtools/webpack';
 import CopyWebpackPlugin from 'copy-webpack-plugin';
 import * as path from 'path';
 import { ScriptTarget } from 'typescript';
@@ -31,6 +32,7 @@ import {
   ScriptsWebpackPlugin,
 } from '../plugins';
 import { ProgressPlugin } from '../plugins/progress-plugin';
+import { createIvyPlugin } from '../plugins/typescript';
 import {
   assetPatterns,
   externalizePackages,
@@ -43,13 +45,16 @@ import {
 
 // eslint-disable-next-line max-lines-per-function
 export async function getCommonConfig(wco: WebpackConfigOptions): Promise<Configuration> {
-  const { root, projectRoot, buildOptions, tsConfig, projectName, sourceRoot } = wco;
+  const { root, projectRoot, buildOptions, tsConfig, projectName, sourceRoot, tsConfigPath } = wco;
   const {
     cache,
     codeCoverage,
     crossOrigin = 'none',
     platform = 'browser',
+    aot = true,
     codeCoverageExclude = [],
+    main,
+    polyfills,
     sourceMap: {
       styles: stylesSourceMap,
       scripts: scriptsSourceMap,
@@ -258,6 +263,18 @@ export async function getCommonConfig(wco: WebpackConfigOptions): Promise<Config
     });
   }
 
+  if (main || polyfills) {
+    extraRules.push({
+      test: /\.[cm]?[tj]sx?$/,
+      loader: AngularWebpackLoaderPath,
+    });
+    extraPlugins.push(createIvyPlugin(wco, aot, tsConfigPath));
+  }
+
+  if (webWorkerTsConfig) {
+    extraPlugins.push(createIvyPlugin(wco, false, path.resolve(wco.root, webWorkerTsConfig)));
+  }
+
   const extraMinimizers = [];
   if (scriptsOptimization) {
     extraMinimizers.push(
@@ -340,7 +357,6 @@ export async function getCommonConfig(wco: WebpackConfigOptions): Promise<Config
     module: {
       // Show an error for missing exports instead of a warning.
       strictExportPresence: true,
-
       parser:
         webWorkerTsConfig === undefined
           ? {

packages/angular_devkit/build_angular/src/webpack/configs/index.ts

@@ -10,5 +10,3 @@ export * from './analytics';
 export * from './common';
 export * from './dev-server';
 export * from './styles';
-export * from './typescript';
-export * from './worker';

packages/angular_devkit/build_angular/src/webpack/configs/worker.ts

@@ -8,9 +8,8 @@
 
 import { getSystemPath } from '@angular-devkit/core';
 import type { CompilerOptions } from '@angular/compiler-cli';
-import { AngularWebpackLoaderPath, AngularWebpackPlugin } from '@ngtools/webpack';
+import { AngularWebpackPlugin } from '@ngtools/webpack';
 import { ScriptTarget } from 'typescript';
-import { Configuration } from 'webpack';
 import { WebpackConfigOptions } from '../../utils/build-options';
 
 function ensureIvy(wco: WebpackConfigOptions): void {
@@ -28,11 +27,15 @@ function ensureIvy(wco: WebpackConfigOptions): void {
   wco.tsConfig.options.enableIvy = true;
 }
 
-function createIvyPlugin(
+export function createIvyPlugin(
   wco: WebpackConfigOptions,
   aot: boolean,
   tsconfig: string,
 ): AngularWebpackPlugin {
+  if (aot) {
+    ensureIvy(wco);
+  }
+
   const { buildOptions } = wco;
   const optimize = buildOptions.optimization.scripts;
 
@@ -86,32 +89,3 @@ function createIvyPlugin(
     inlineStyleFileExtension,
   });
 }
-
-export function getTypeScriptConfig(wco: WebpackConfigOptions): Configuration {
-  const {
-    buildOptions: { aot = false, main, polyfills },
-    tsConfigPath,
-  } = wco;
-
-  if (main || polyfills) {
-    ensureIvy(wco);
-
-    return {
-      module: {
-        rules: [
-          {
-            test: /\.[jt]sx?$/,
-            loader: AngularWebpackLoaderPath,
-          },
-        ],
-      },
-      plugins: [createIvyPlugin(wco, aot, tsConfigPath)],
-    };
-  }
-
-  return {};
-}
-
-export function getTypescriptWorkerPlugin(wco: WebpackConfigOptions, workerTsConfigPath: string) {
-  return createIvyPlugin(wco, false, workerTsConfigPath);
-}