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

@@ -28,7 +28,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
@@ -134,11 +133,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

@@ -108,3 +108,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

@@ -42,6 +42,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';
@@ -161,6 +162,10 @@ export function buildWebpackConfig(
  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."
@@ -325,6 +320,10 @@
  "description": "**EXPERIMENTAL** Transform import statements for lazy routes to import factories when using View Engine. Should only be used when switching back and forth between View Engine and Ivy. See https://angular.io/guide/ivy for usage information.",
  "type": "boolean",
  "default": false
+ },
+ "webWorkerTsConfig": {
+ "type": "string",
+ "description": "TypeScript configuration for Web Worker modules."
  }
  },
  "additionalProperties": false,