2b23454 refactor(@angular-devkit/build-angular): add transform support to server builder

Author: Angular Builds

package.json

@@ -1,17 +1,17 @@
 {
   "name": "@angular-devkit/build-angular",
-  "version": "0.800.0-beta.13+33.359d4f9",
+  "version": "0.800.0-beta.13+39.2b23454",
   "description": "Angular Webpack Build Facade",
   "experimental": true,
   "main": "src/index.js",
   "typings": "src/index.d.ts",
   "builders": "builders.json",
   "dependencies": {
-    "@angular-devkit/architect": "github:angular/angular-devkit-architect-builds#359d4f9",
-    "@angular-devkit/build-optimizer": "github:angular/angular-devkit-build-optimizer-builds#359d4f9",
-    "@angular-devkit/build-webpack": "github:angular/angular-devkit-build-webpack-builds#359d4f9",
-    "@angular-devkit/core": "github:angular/angular-devkit-core-builds#359d4f9",
-    "@ngtools/webpack": "github:angular/ngtools-webpack-builds#359d4f9",
+    "@angular-devkit/architect": "github:angular/angular-devkit-architect-builds#2b23454",
+    "@angular-devkit/build-optimizer": "github:angular/angular-devkit-build-optimizer-builds#2b23454",
+    "@angular-devkit/build-webpack": "github:angular/angular-devkit-build-webpack-builds#2b23454",
+    "@angular-devkit/core": "github:angular/angular-devkit-core-builds#2b23454",
+    "@ngtools/webpack": "github:angular/ngtools-webpack-builds#2b23454",
     "ajv": "6.10.0",
     "autoprefixer": "9.5.1",
     "browserslist": "4.5.4",

src/browser/index.d.ts

@@ -10,22 +10,20 @@ import { BuilderContext, BuilderOutput } from '@angular-devkit/architect';
 import { WebpackLoggingCallback } from '@angular-devkit/build-webpack';
 import { experimental, json, logging, virtualFs } from '@angular-devkit/core';
 import * as fs from 'fs';
-import { Observable } from 'rxjs';
 import * as webpack from 'webpack';
+import { ExecutionTransformer } from '../transforms';
 import { Schema as BrowserBuilderSchema } from './schema';
 export declare type BrowserBuilderOutput = json.JsonObject & BuilderOutput & {
     outputPath: string;
 };
 export declare function createBrowserLoggingCallback(verbose: boolean, logger: logging.LoggerApi): WebpackLoggingCallback;
-export declare function buildBrowserWebpackConfigFromContext(options: BrowserBuilderSchema, context: BuilderContext, host: virtualFs.Host<fs.Stats>): Promise<{
+export declare function buildBrowserWebpackConfigFromContext(options: BrowserBuilderSchema, context: BuilderContext, host?: virtualFs.Host<fs.Stats>): Promise<{
     workspace: experimental.workspace.Workspace;
     config: webpack.Configuration[];
 }>;
-export declare type BrowserConfigTransformFn = (workspace: experimental.workspace.Workspace, config: webpack.Configuration) => Observable<webpack.Configuration>;
 export declare function buildWebpackBrowser(options: BrowserBuilderSchema, context: BuilderContext, transforms?: {
-    config?: BrowserConfigTransformFn;
-    output?: (output: BrowserBuilderOutput) => Observable<BuilderOutput>;
+    webpackConfiguration?: ExecutionTransformer<webpack.Configuration>;
     logging?: WebpackLoggingCallback;
-}): Observable<BuilderOutput>;
+}): import("rxjs").Observable<BrowserBuilderOutput>;
 declare const _default: import("@angular-devkit/architect/src/internal").Builder<json.JsonObject & BrowserBuilderSchema>;
 export default _default;

src/browser/index.js

@@ -40,7 +40,7 @@ function createBrowserLoggingCallback(verbose, logger) {
     };
 }
 exports.createBrowserLoggingCallback = createBrowserLoggingCallback;
-async function buildBrowserWebpackConfigFromContext(options, context, host) {
+async function buildBrowserWebpackConfigFromContext(options, context, host = new node_1.NodeJsSyncHost()) {
     return webpack_browser_config_1.generateBrowserWebpackConfigFromContext(options, context, wco => [
         webpack_configs_1.getCommonConfig(wco),
         webpack_configs_1.getBrowserConfig(wco),
@@ -75,30 +75,26 @@ function getCompilerConfig(wco) {
     }
     return {};
 }
+async function initialize(options, context, host, webpackConfigurationTransform) {
+    const { config, workspace } = await buildBrowserWebpackConfigFromContext(options, context, host);
+    let transformedConfig;
+    if (webpackConfigurationTransform) {
+        transformedConfig = [];
+        for (const c of config) {
+            transformedConfig.push(await webpackConfigurationTransform(c));
+        }
+    }
+    if (options.deleteOutputPath) {
+        await utils_1.deleteOutputDir(core_1.normalize(context.workspaceRoot), core_1.normalize(options.outputPath), host).toPromise();
+    }
+    return { config: transformedConfig || config, workspace };
+}
 function buildWebpackBrowser(options, context, transforms = {}) {
     const host = new node_1.NodeJsSyncHost();
     const root = core_1.normalize(context.workspaceRoot);
-    const configFn = transforms.config;
-    const outputFn = transforms.output;
     const loggingFn = transforms.logging
         || createBrowserLoggingCallback(!!options.verbose, context.logger);
-    // This makes a host observable into a cold one. This is because we want to wait until
-    // subscription before calling buildBrowserWebpackConfigFromContext, which can throw.
-    return rxjs_1.of(null).pipe(operators_1.switchMap(() => rxjs_1.from(buildBrowserWebpackConfigFromContext(options, context, host))), operators_1.switchMap(({ workspace, config }) => {
-        if (configFn) {
-            return rxjs_1.combineLatest(config.map(config => configFn(workspace, config))).pipe(operators_1.map(config => ({ workspace, config })));
-        }
-        else {
-            return rxjs_1.of({ workspace, config });
-        }
-    }), operators_1.switchMap(({ workspace, config }) => {
-        if (options.deleteOutputPath) {
-            return utils_1.deleteOutputDir(root, core_1.normalize(options.outputPath), host).pipe(operators_1.map(() => ({ workspace, config })));
-        }
-        else {
-            return rxjs_1.of({ workspace, config });
-        }
-    }), operators_1.switchMap(({ workspace, config: configs }) => {
+    return rxjs_1.from(initialize(options, context, host, transforms.webpackConfiguration)).pipe(operators_1.switchMap(({ workspace, config: configs }) => {
         const projectName = context.target
             ? context.target.project : workspace.getDefaultProjectName();
         if (!projectName) {
@@ -141,7 +137,7 @@ function buildWebpackBrowser(options, context, transforms = {}) {
             ...event,
             // If we use differential loading, both configs have the same outputs
             outputPath: path.resolve(context.workspaceRoot, options.outputPath),
-        })), operators_1.concatMap(output => outputFn ? outputFn(output) : rxjs_1.of(output)));
+        })));
     }));
 }
 exports.buildWebpackBrowser = buildWebpackBrowser;

src/dev-server/index.d.ts

@@ -9,9 +9,10 @@ import { BuilderContext } from '@angular-devkit/architect';
 import { DevServerBuildOutput, WebpackLoggingCallback } from '@angular-devkit/build-webpack';
 import { experimental, json, logging } from '@angular-devkit/core';
 import { Observable } from 'rxjs';
+import * as webpack from 'webpack';
 import * as WebpackDevServer from 'webpack-dev-server';
-import { BrowserConfigTransformFn } from '../browser';
 import { Schema as BrowserBuilderSchema } from '../browser/schema';
+import { ExecutionTransformer } from '../transforms';
 import { Schema } from './schema';
 export declare type DevServerBuilderSchema = Schema & json.JsonObject;
 export declare const devServerBuildOverriddenKeys: (keyof DevServerBuilderSchema)[];
@@ -27,8 +28,7 @@ export declare type ServerConfigTransformFn = (workspace: experimental.workspace
  *     transforming webpack configuration before passing it to webpack).
  */
 export declare function serveWebpackBrowser(options: DevServerBuilderSchema, context: BuilderContext, transforms?: {
-    browserConfig?: BrowserConfigTransformFn;
-    serverConfig?: ServerConfigTransformFn;
+    webpackConfiguration?: ExecutionTransformer<webpack.Configuration>;
     logging?: WebpackLoggingCallback;
 }): Observable<DevServerBuilderOutput>;
 /**

src/dev-server/index.js

@@ -68,14 +68,10 @@ function serveWebpackBrowser(options, context, transforms = {}) {
         const webpackConfigResult = await browser_1.buildBrowserWebpackConfigFromContext(browserOptions, context, host);
         // No differential loading for dev-server, hence there is just one config
         let webpackConfig = webpackConfigResult.config[0];
-        const workspace = webpackConfigResult.workspace;
-        if (transforms.browserConfig) {
-            webpackConfig = await transforms.browserConfig(workspace, webpackConfig).toPromise();
-        }
         const port = await check_port_1.checkPort(options.port || 0, options.host || 'localhost', 4200);
-        let webpackDevServerConfig = buildServerConfig(root, options, browserOptions, context.logger);
-        if (transforms.serverConfig) {
-            webpackDevServerConfig = await transforms.serverConfig(workspace, webpackConfig).toPromise();
+        const webpackDevServerConfig = webpackConfig.devServer = buildServerConfig(root, options, browserOptions, context.logger);
+        if (transforms.webpackConfiguration) {
+            webpackConfig = await transforms.webpackConfiguration(webpackConfig);
         }
         return { browserOptions, webpackConfig, webpackDevServerConfig, port };
     }
@@ -136,7 +132,6 @@ function serveWebpackBrowser(options, context, transforms = {}) {
         **
       `);
         openAddress = serverAddress + webpackDevServerConfig.publicPath;
-        webpackConfig.devServer = webpackDevServerConfig;
         return build_webpack_1.runWebpackDevServer(webpackConfig, context, { logging: loggingFn });
     }), operators_1.map(buildEvent => {
         if (first && options.open) {

src/index.d.ts

@@ -5,6 +5,7 @@
  * 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
  */
+export * from './transforms';
 export * from './app-shell';
 export * from './browser';
 export { AssetPattern, AssetPatternClass as AssetPatternObject, Budget, ExtraEntryPoint, ExtraEntryPointClass as ExtraEntryPointObject, FileReplacement, OptimizationClass as OptimizationObject, OptimizationUnion, OutputHashing, Schema as BrowserBuilderSchema, SourceMapClass as SourceMapObject, SourceMapUnion, StylePreprocessorOptions, Type, } from './browser/schema';
@@ -13,5 +14,5 @@ export * from './extract-i18n';
 export * from './karma';
 export * from './karma/schema';
 export * from './protractor';
-export * from './server';
+export { execute as executeServerBuilder } from './server';
 export * from './tslint';

src/index.js

@@ -10,12 +10,6 @@ function __export(m) {
     for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
 }
 Object.defineProperty(exports, "__esModule", { value: true });
-// TODO: remove this commented AJV require.
-// We don't actually require AJV, but there is a bug with NPM and peer dependencies that is
-// whose workaround is to depend on AJV.
-// See https://github.com/angular/angular-cli/issues/9691#issuecomment-367322703 for details.
-// We need to add a require here to satisfy the dependency checker.
-// require('ajv');
 __export(require("./app-shell"));
 __export(require("./browser"));
 var schema_1 = require("./browser/schema");
@@ -25,5 +19,6 @@ __export(require("./dev-server"));
 __export(require("./extract-i18n"));
 __export(require("./karma"));
 __export(require("./protractor"));
-__export(require("./server"));
+var server_1 = require("./server");
+exports.executeServerBuilder = server_1.execute;
 __export(require("./tslint"));

src/karma/index.d.ts

@@ -8,14 +8,14 @@
 import { BuilderContext, BuilderOutput } from '@angular-devkit/architect';
 import { Observable } from 'rxjs';
 import * as webpack from 'webpack';
+import { ExecutionTransformer } from '../transforms';
 import { Schema as KarmaBuilderOptions } from './schema';
 declare type KarmaConfigOptions = import('karma').ConfigOptions & {
     buildWebpack?: unknown;
     configFile?: string;
 };
-declare type WebpackConfigurationTransformer = (configuration: webpack.Configuration) => webpack.Configuration;
 export declare function execute(options: KarmaBuilderOptions, context: BuilderContext, transforms?: {
-    webpackConfiguration?: WebpackConfigurationTransformer;
+    webpackConfiguration?: ExecutionTransformer<webpack.Configuration>;
     karmaOptions?: (options: KarmaConfigOptions) => KarmaConfigOptions;
 }): Observable<BuilderOutput>;
 export { KarmaBuilderOptions };

src/karma/index.js

@@ -13,7 +13,7 @@ const rxjs_1 = require("rxjs");
 const operators_1 = require("rxjs/operators");
 const webpack_configs_1 = require("../angular-cli-files/models/webpack-configs");
 const webpack_browser_config_1 = require("../utils/webpack-browser-config");
-async function initialize(options, context) {
+async function initialize(options, context, webpackConfigurationTransformer) {
     const { config } = await webpack_browser_config_1.generateBrowserWebpackConfigFromContext(
     // only two properties are missing:
     // * `outputPath` which is fixed for tests
@@ -27,10 +27,13 @@ async function initialize(options, context) {
     ]);
     // tslint:disable-next-line:no-implicit-dependencies
     const karma = await Promise.resolve().then(() => require('karma'));
-    return [karma, config[0]];
+    return [
+        karma,
+        webpackConfigurationTransformer ? await webpackConfigurationTransformer(config[0]) : config[0],
+    ];
 }
 function execute(options, context, transforms = {}) {
-    return rxjs_1.from(initialize(options, context)).pipe(operators_1.switchMap(([karma, webpackConfig]) => new rxjs_1.Observable(subscriber => {
+    return rxjs_1.from(initialize(options, context, transforms.webpackConfiguration)).pipe(operators_1.switchMap(([karma, webpackConfig]) => new rxjs_1.Observable(subscriber => {
         const karmaOptions = {};
         if (options.watch !== undefined) {
             karmaOptions.singleRun = !options.watch;
@@ -52,9 +55,7 @@ function execute(options, context, transforms = {}) {
         karmaOptions.configFile = path_1.resolve(context.workspaceRoot, options.karmaConfig);
         karmaOptions.buildWebpack = {
             options,
-            webpackConfig: transforms.webpackConfiguration
-                ? transforms.webpackConfiguration(webpackConfig)
-                : webpackConfig,
+            webpackConfig,
             // Pass onto Karma to emit BuildEvents.
             successCb: () => subscriber.next({ success: true }),
             failureCb: () => subscriber.next({ success: false }),

src/server/index.d.ts

@@ -1,19 +1,21 @@
-/// <reference types="node" />
 /**
  * @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 { BuilderOutput } from '@angular-devkit/architect';
-import { Path, json, logging, virtualFs } from '@angular-devkit/core';
-import { Stats } from 'fs';
-import { NormalizedWebpackServerBuilderSchema } from '../utils';
-import { Schema as BuildWebpackServerSchema } from './schema';
+import { BuilderContext, BuilderOutput } from '@angular-devkit/architect';
+import { json } from '@angular-devkit/core';
+import { Observable } from 'rxjs';
+import * as webpack from 'webpack';
+import { ExecutionTransformer } from '../transforms';
+import { Schema as BuildWebpackServerOptions } from './schema';
 export declare type ServerBuilderOutput = json.JsonObject & BuilderOutput & {
     outputPath?: string;
 };
-declare const _default: import("@angular-devkit/architect/src/internal").Builder<json.JsonObject & BuildWebpackServerSchema>;
+export declare function execute(options: BuildWebpackServerOptions, context: BuilderContext, transforms?: {
+    webpackConfiguration?: ExecutionTransformer<webpack.Configuration>;
+}): Observable<ServerBuilderOutput>;
+declare const _default: import("@angular-devkit/architect/src/internal").Builder<json.JsonObject & BuildWebpackServerOptions>;
 export default _default;
-export declare function buildServerWebpackConfig(root: Path, projectRoot: Path, _host: virtualFs.Host<Stats>, options: NormalizedWebpackServerBuilderSchema, logger: logging.Logger): any;