feat(@angular-devkit/build-angular): fine grain settings for sourceMaps

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

@@ -633,9 +633,39 @@
               "default": false
             },
             "sourceMap": {
-              "type": "boolean",
               "description": "Output sourcemaps.",
-              "default": true
+              "default": true,
+              "oneOf": [
+                {
+                  "type": "object",
+                  "properties": {
+                    "scripts": {
+                      "type": "boolean",
+                      "description": "Output sourcemaps for all scripts.",
+                      "default": true
+                    },
+                    "styles": {
+                      "type": "boolean",
+                      "description": "Output sourcemaps for all styles.",
+                      "default": true
+                    },
+                    "hidden": {
+                      "type": "boolean",
+                      "description": "Output sourcemaps used for error reporting tools.",
+                      "default": false
+                    },
+                    "vendor": {
+                      "type": "boolean",
+                      "description": "Resolve vendor packages sourcemaps.",
+                      "default": false
+                    }
+                  },
+                  "additionalProperties": false
+                },
+                {
+                  "type": "boolean"
+                }
+              ]
             },
             "vendorSourceMap": {
               "type": "boolean",
@@ -1045,8 +1075,34 @@
               "description": "Build using Ahead of Time compilation."
             },
             "sourceMap": {
-              "type": "boolean",
-              "description": "Output sourcemaps."
+              "description": "Output sourcemaps.",
+              "default": true,
+              "oneOf": [
+                {
+                  "type": "object",
+                  "properties": {
+                    "scripts": {
+                      "type": "boolean",
+                      "description": "Output sourcemaps for all scripts.",
+                      "default": true
+                    },
+                    "styles": {
+                      "type": "boolean",
+                      "description": "Output sourcemaps for all styles.",
+                      "default": true
+                    },
+                    "vendor": {
+                      "type": "boolean",
+                      "description": "Resolve vendor packages sourcemaps.",
+                      "default": false
+                    }
+                  },
+                  "additionalProperties": false
+                },
+                {
+                  "type": "boolean"
+                }
+              ]
             },
             "vendorSourceMap": {
               "type": "boolean",
@@ -1189,9 +1245,34 @@
               "description": "Defines the build environment."
             },
             "sourceMap": {
-              "type": "boolean",
               "description": "Output sourcemaps.",
-              "default": true
+              "default": true,
+              "oneOf": [
+                {
+                  "type": "object",
+                  "properties": {
+                    "scripts": {
+                      "type": "boolean",
+                      "description": "Output sourcemaps for all scripts.",
+                      "default": true
+                    },
+                    "styles": {
+                      "type": "boolean",
+                      "description": "Output sourcemaps for all styles.",
+                      "default": true
+                    },
+                    "vendor": {
+                      "type": "boolean",
+                      "description": "Resolve vendor packages sourcemaps.",
+                      "default": false
+                    }
+                  },
+                  "additionalProperties": false
+                },
+                {
+                  "type": "boolean"
+                }
+              ]
             },
             "progress": {
               "type": "boolean",
@@ -1455,9 +1536,39 @@
               "description": "The path where style resources will be placed, relative to outputPath."
             },
             "sourceMap": {
-              "type": "boolean",
               "description": "Output sourcemaps.",
-              "default": true
+              "default": true,
+              "oneOf": [
+                {
+                  "type": "object",
+                  "properties": {
+                    "scripts": {
+                      "type": "boolean",
+                      "description": "Output sourcemaps for all scripts.",
+                      "default": true
+                    },
+                    "styles": {
+                      "type": "boolean",
+                      "description": "Output sourcemaps for all styles.",
+                      "default": true
+                    },
+                    "hidden": {
+                      "type": "boolean",
+                      "description": "Output sourcemaps used for error reporting tools.",
+                      "default": false
+                    },
+                    "vendor": {
+                      "type": "boolean",
+                      "description": "Resolve vendor packages sourcemaps.",
+                      "default": false
+                    }
+                  },
+                  "additionalProperties": false
+                },
+                {
+                  "type": "boolean"
+                }
+              ]
             },
             "vendorSourceMap": {
               "type": "boolean",

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

@@ -24,6 +24,9 @@ export interface BuildOptions {
   resourcesOutputPath?: string;
   aot?: boolean;
   sourceMap?: boolean;
+  scriptsSourceMap?: boolean;
+  stylesSourceMap?: boolean;
+  hiddenSourceMap?: boolean;
   vendorSourceMap?: boolean;
   evalSourceMap?: boolean;
   vendorChunk?: boolean;

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

@@ -10,7 +10,7 @@ import * as path from 'path';
 import { IndexHtmlWebpackPlugin } from '../../plugins/index-html-webpack-plugin';
 import { generateEntryPoints } from '../../utilities/package-chunk-sort';
 import { WebpackConfigOptions } from '../build-options';
-import { normalizeExtraEntryPoints } from './utils';
+import { getSourceMapDevTool, normalizeExtraEntryPoints } from './utils';
 
 const SubresourceIntegrityPlugin = require('webpack-subresource-integrity');
 
@@ -19,16 +19,11 @@ export function getBrowserConfig(wco: WebpackConfigOptions) {
   const { root, buildOptions } = wco;
   const extraPlugins = [];
 
-  let sourcemaps: string | false = false;
-  if (buildOptions.sourceMap) {
-    // See https://webpack.js.org/configuration/devtool/ for sourcemap types.
-    if (buildOptions.evalSourceMap && !buildOptions.optimization) {
-      // Produce eval sourcemaps for development with serve, which are faster.
-      sourcemaps = 'eval';
-    } else {
-      // Produce full separate sourcemaps for production.
-      sourcemaps = 'source-map';
-    }
+  let isEval = false;
+  // See https://webpack.js.org/configuration/devtool/ for sourcemap types.
+  if (buildOptions.sourceMap && buildOptions.evalSourceMap && !buildOptions.optimization) {
+    // Produce eval sourcemaps for development with serve, which are faster.
+    isEval = true;
   }
 
   if (buildOptions.index) {
@@ -59,11 +54,25 @@ export function getBrowserConfig(wco: WebpackConfigOptions) {
     }));
   }
 
+  if (!isEval && buildOptions.sourceMap) {
+    const {
+      scriptsSourceMap = false,
+      stylesSourceMap = false,
+      hiddenSourceMap = false,
+    } = buildOptions;
+
+    extraPlugins.push(getSourceMapDevTool(
+      scriptsSourceMap,
+      stylesSourceMap,
+      hiddenSourceMap,
+    ));
+  }
+
   const globalStylesBundleNames = normalizeExtraEntryPoints(buildOptions.styles, 'styles')
     .map(style => style.bundleName);
 
   return {
-    devtool: sourcemaps,
+    devtool: isEval ? 'eval' : false,
     resolve: {
       mainFields: [
         ...(wco.supportES2015 ? ['es2015'] : []),

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

@@ -15,7 +15,7 @@ import { ScriptsWebpackPlugin } from '../../plugins/scripts-webpack-plugin';
 import { findUp } from '../../utilities/find-up';
 import { isDirectory } from '../../utilities/is-directory';
 import { requireProjectModule } from '../../utilities/require-project-module';
-import { WebpackConfigOptions } from '../build-options';
+import { BuildOptions, WebpackConfigOptions } from '../build-options';
 import { getOutputHashFormat, normalizeExtraEntryPoints } from './utils';
 
 const ProgressPlugin = require('webpack/lib/ProgressPlugin');
@@ -102,7 +102,7 @@ export function getCommonConfig(wco: WebpackConfigOptions) {
 
       extraPlugins.push(new ScriptsWebpackPlugin({
         name: bundleName,
-        sourceMap: buildOptions.sourceMap,
+        sourceMap: buildOptions.scriptsSourceMap,
         filename: `${path.basename(bundleName)}${hash}.js`,
         scripts: script.paths,
         basePath: projectRoot,
@@ -174,7 +174,7 @@ export function getCommonConfig(wco: WebpackConfigOptions) {
       use: [
         {
           loader: buildOptimizerLoader,
-          options: { sourceMap: buildOptions.sourceMap },
+          options: { sourceMap: buildOptions.scriptsSourceMap },
         },
       ],
     };
@@ -297,12 +297,12 @@ export function getCommonConfig(wco: WebpackConfigOptions) {
         // TODO: check with Mike what this feature needs.
         new BundleBudgetPlugin({ budgets: buildOptions.budgets }),
         new CleanCssWebpackPlugin({
-          sourceMap: buildOptions.sourceMap,
+          sourceMap: buildOptions.stylesSourceMap,
           // component styles retain their original file name
           test: (file) => /\.(?:css|scss|sass|less|styl)$/.test(file),
         }),
         new TerserPlugin({
-          sourceMap: buildOptions.sourceMap,
+          sourceMap: buildOptions.scriptsSourceMap,
           parallel: true,
           cache: true,
           terserOptions,

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

@@ -7,6 +7,7 @@
  */
 import { Configuration } from 'webpack';
 import { WebpackConfigOptions } from '../build-options';
+import { getSourceMapDevTool } from './utils';
 
 
 /**
@@ -15,8 +16,22 @@ import { WebpackConfigOptions } from '../build-options';
  */
 export function getServerConfig(wco: WebpackConfigOptions) {
 
+  const extraPlugins = [];
+  if (wco.buildOptions.sourceMap) {
+    const {
+      scriptsSourceMap = false,
+      stylesSourceMap = false,
+      hiddenSourceMap = false,
+    } = wco.buildOptions;
+
+    extraPlugins.push(getSourceMapDevTool(
+      scriptsSourceMap,
+      stylesSourceMap,
+      hiddenSourceMap,
+    ));
+  }
+
   const config: Configuration = {
-    devtool: wco.buildOptions.sourceMap ? 'source-map' : false,
     resolve: {
       mainFields: [
         ...(wco.supportES2015 ? ['es2015'] : []),
@@ -27,6 +42,7 @@ export function getServerConfig(wco: WebpackConfigOptions) {
     output: {
       libraryTarget: 'commonjs',
     },
+    plugins: extraPlugins,
     node: false,
   };
 

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

@@ -40,7 +40,8 @@ export function getStylesConfig(wco: WebpackConfigOptions) {
   const entryPoints: { [key: string]: string[] } = {};
   const globalStylePaths: string[] = [];
   const extraPlugins = [];
-  const cssSourceMap = buildOptions.sourceMap;
+
+  const cssSourceMap = buildOptions.stylesSourceMap;
 
   // Determine hashing format.
   const hashFormat = getOutputHashFormat(buildOptions.outputHashing as string);
@@ -187,7 +188,7 @@ export function getStylesConfig(wco: WebpackConfigOptions) {
         options: {
           ident: 'embedded',
           plugins: postcssPluginCreator,
-          sourceMap: cssSourceMap ? 'inline' : false,
+          sourceMap: cssSourceMap && !buildOptions.hiddenSourceMap ? 'inline' : false,
         },
       },
       ...(use as webpack.Loader[]),
@@ -208,7 +209,10 @@ export function getStylesConfig(wco: WebpackConfigOptions) {
             options: {
               ident: buildOptions.extractCss ? 'extracted' : 'embedded',
               plugins: postcssPluginCreator,
-              sourceMap: cssSourceMap && !buildOptions.extractCss ? 'inline' : cssSourceMap,
+              sourceMap: cssSourceMap
+                && !buildOptions.extractCss
+                && !buildOptions.hiddenSourceMap
+                ? 'inline' : cssSourceMap,
             },
           },
           ...(use as webpack.Loader[]),

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

@@ -10,6 +10,7 @@ import * as glob from 'glob';
 import * as path from 'path';
 import * as webpack from 'webpack';
 import { WebpackConfigOptions, WebpackTestOptions } from '../build-options';
+import { getSourceMapDevTool } from './utils';
 
 
 /**
@@ -55,6 +56,20 @@ export function getTestConfig(
     });
   }
 
+  if (wco.buildOptions.sourceMap) {
+    const {
+      scriptsSourceMap = false,
+      stylesSourceMap = false,
+    } = wco.buildOptions;
+
+    extraPlugins.push(getSourceMapDevTool(
+      scriptsSourceMap,
+      stylesSourceMap,
+      false,
+      true,
+    ));
+  }
+
   return {
     mode: 'development',
     resolve: {
@@ -63,7 +78,7 @@ export function getTestConfig(
         'browser', 'module', 'main',
       ],
     },
-    devtool: buildOptions.sourceMap ? 'inline-source-map' : 'eval',
+    devtool: buildOptions.sourceMap ? false : 'eval',
     entry: {
       main: path.resolve(root, buildOptions.main),
     },

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

@@ -75,7 +75,7 @@ function _createAotPlugin(
     locale: buildOptions.i18nLocale,
     platform: buildOptions.platform === 'server' ? PLATFORM.Server : PLATFORM.Browser,
     missingTranslation: buildOptions.i18nMissingTranslation,
-    sourceMap: buildOptions.sourceMap,
+    sourceMap: buildOptions.scriptsSourceMap,
     additionalLazyModules,
     hostReplacementPaths,
     nameLazyFiles: buildOptions.namedChunks,
@@ -108,7 +108,7 @@ export function getAotConfig(
   if (buildOptions.buildOptimizer) {
     loaders.unshift({
       loader: buildOptimizerLoader,
-      options: { sourceMap: buildOptions.sourceMap }
+      options: { sourceMap: buildOptions.scriptsSourceMap }
     });
   }