diff --git a/packages/angular-cli/models/webpack-configs/styles.ts b/packages/angular-cli/models/webpack-configs/styles.ts index 1e67419f944a..0e7661457ded 100644 --- a/packages/angular-cli/models/webpack-configs/styles.ts +++ b/packages/angular-cli/models/webpack-configs/styles.ts @@ -33,6 +33,10 @@ export function getStylesConfig(wco: WebpackConfigOptions) { const entryPoints: { [key: string]: string[] } = {}; const globalStylePaths: string[] = []; const extraPlugins: any[] = []; + // style-loader does not support sourcemaps without absolute publicPath, so it's + // better to disable them when not extracting css + // https://github.com/webpack-contrib/style-loader#recommended-configuration + const cssSourceMap = buildOptions.extractCss && buildOptions.sourcemap; // discard comments in production const extraPostCssPlugins = buildOptions.target === 'production' @@ -75,7 +79,7 @@ export function getStylesConfig(wco: WebpackConfigOptions) { // so we need to add options in its query { test: /\.styl$/, loaders: [`stylus-loader?${JSON.stringify({ - sourceMap: buildOptions.sourcemap, + sourceMap: cssSourceMap, paths: includePaths })}`] } @@ -95,7 +99,7 @@ export function getStylesConfig(wco: WebpackConfigOptions) { loader: [ // css-loader doesn't support webpack.LoaderOptionsPlugin properly, // so we need to add options in its query - `css-loader?${JSON.stringify({ sourceMap: buildOptions.sourcemap })}`, + `css-loader?${JSON.stringify({ sourceMap: cssSourceMap })}`, ...commonLoaders, ...loaders ], @@ -121,14 +125,14 @@ export function getStylesConfig(wco: WebpackConfigOptions) { disable: !buildOptions.extractCss }), new webpack.LoaderOptionsPlugin({ - sourceMap: true, + sourceMap: cssSourceMap, options: { postcss: [autoprefixer()].concat(extraPostCssPlugins), // css-loader, stylus-loader don't support LoaderOptionsPlugin properly // options are in query instead - sassLoader: { sourceMap: buildOptions.sourcemap, includePaths }, + sassLoader: { sourceMap: cssSourceMap, includePaths }, // less-loader doesn't support paths - lessLoader: { sourceMap: buildOptions.sourcemap }, + lessLoader: { sourceMap: cssSourceMap }, // context needed as a workaround https://github.com/jtangelder/sass-loader/issues/285 context: projectRoot, },