feat(@angular-devkit/build-angular): support TS web workers

Author: filipesilva

packages/angular/cli/lib/config/schema.json

@@ -836,11 +836,6 @@
             "ngswConfigPath": {
               "type": "string",
               "description": "Path to ngsw-config.json."
-            },  
-            "autoBundleWorkerModules": {
-              "type": "boolean",
-              "description": "Automatically bundle new Worker('..', { type:'module' })",
-              "default": true
             },
             "skipAppShell": {
               "type": "boolean",
@@ -887,6 +882,10 @@
               "type": "boolean",
               "default": false,
               "x-deprecated": true
+            },
+            "webWorkerTsConfig": {
+              "type": "string",
+              "description": "TypeScript configuration for Web Worker modules."
             }
           },
           "additionalProperties": false,

packages/angular_devkit/build_angular/src/angular-cli-files/models/build-options.ts

@@ -54,7 +54,7 @@ export interface BuildOptions {
   namedChunks?: boolean;
   subresourceIntegrity?: boolean;
   serviceWorker?: boolean;
-  autoBundleWorkerModules?: boolean;
+  webWorkerTsConfig?: string;
   skipAppShell?: boolean;
   statsJson: boolean;
   forkTypeChecker: boolean;

packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/common.ts

@@ -22,7 +22,6 @@ const ProgressPlugin = require('webpack/lib/ProgressPlugin');
 const CircularDependencyPlugin = require('circular-dependency-plugin');
 const TerserPlugin = require('terser-webpack-plugin');
 const StatsPlugin = require('stats-webpack-plugin');
-const WorkerPlugin = require('worker-plugin');
 
 
 // tslint:disable-next-line:no-any
@@ -128,11 +127,6 @@ export function getCommonConfig(wco: WebpackConfigOptions): Configuration {
     });
   }
 
-  if (buildOptions.autoBundleWorkerModules) {
-    const workerPluginInstance = new WorkerPlugin({ globalObject: false });
-    extraPlugins.push(workerPluginInstance);
-  }
-
   // process asset entries
   if (buildOptions.assets) {
     const copyWebpackPluginPatterns = buildOptions.assets.map((asset: AssetPatternClass) => {

packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/index.ts

@@ -13,3 +13,4 @@ export * from './test';
 export * from './typescript';
 export * from './utils';
 export * from './stats';
+export * from './worker';

packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/typescript.ts

@@ -107,3 +107,24 @@ export function getAotConfig(wco: WebpackConfigOptions, extract = false) {
     plugins: [_createAotPlugin(wco, { tsConfigPath }, true, extract)]
   };
 }
+
+export function getTypescriptWorkerPlugin(wco: WebpackConfigOptions, workerTsConfigPath: string) {
+  const { buildOptions } = wco;
+
+  const pluginOptions: AngularCompilerPluginOptions = {
+    skipCodeGeneration: true,
+    tsConfigPath: workerTsConfigPath,
+    mainPath: undefined,
+    platform: PLATFORM.Browser,
+    sourceMap: buildOptions.sourceMap.scripts,
+    forkTypeChecker: buildOptions.forkTypeChecker,
+    contextElementDependencyConstructor: require('webpack/lib/dependencies/ContextElementDependency'),
+    logger: wco.logger,
+    // Run no transformers.
+    platformTransformers: [],
+    // Don't attempt lazy route discovery.
+    discoverLazyRoutes: false,
+  };
+
+  return new AngularCompilerPlugin(pluginOptions);
+}

packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/worker.ts

@@ -0,0 +1,30 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+import { resolve } from 'path';
+import { Configuration } from 'webpack';
+import { WebpackConfigOptions } from '../build-options';
+import { getTypescriptWorkerPlugin } from './typescript';
+
+const WorkerPlugin = require('worker-plugin');
+
+
+export function getWorkerConfig(wco: WebpackConfigOptions): Configuration {
+  const { buildOptions } = wco;
+  if (!buildOptions.webWorkerTsConfig) {
+    throw new Error('The `webWorkerTsConfig` must be a string.');
+  }
+
+  const workerTsConfigPath = resolve(wco.root, buildOptions.webWorkerTsConfig);
+
+  return {
+    plugins: [new WorkerPlugin({
+      globalObject: false,
+      plugins: [getTypescriptWorkerPlugin(wco, workerTsConfigPath)],
+    })],
+  };
+}

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

@@ -25,6 +25,7 @@ import {
   getNonAotConfig,
   getStatsConfig,
   getStylesConfig,
+  getWorkerConfig,
 } from '../angular-cli-files/models/webpack-configs';
 import { readTsconfig } from '../angular-cli-files/utilities/read-tsconfig';
 import { requireProjectModule } from '../angular-cli-files/utilities/require-project-module';
@@ -154,6 +155,10 @@ export class BrowserBuilder implements Builder<BrowserBuilderSchema> {
       webpackConfigs.push(typescriptConfigPartial);
     }
 
+    if (wco.buildOptions.webWorkerTsConfig) {
+      webpackConfigs.push(getWorkerConfig(wco));
+    }
+
     const webpackConfig = webpackMerge(webpackConfigs);
 
     if (options.profile || process.env['NG_BUILD_PROFILING']) {

packages/angular_devkit/build_angular/src/browser/schema.json

@@ -259,11 +259,6 @@
       "description": "Generates a service worker config for production builds.",
       "default": false
     },
-    "autoBundleWorkerModules": {
-      "type": "boolean",
-      "description": "Automatically bundle new Worker('..', { type:'module' })",
-      "default": true
-    },    
     "ngswConfigPath": {
       "type": "string",
       "description": "Path to ngsw-config.json."
@@ -320,6 +315,10 @@
       "type": "boolean",
       "default": false,
       "x-deprecated": true
+    },
+    "webWorkerTsConfig": {
+      "type": "string",
+      "description": "TypeScript configuration for Web Worker modules."
     }
   },
   "additionalProperties": false,