From 3c673a7f6d05d6670d9426cf2568abf7bb5bb4ed Mon Sep 17 00:00:00 2001 From: Jean-Yves COUET Date: Tue, 28 Nov 2017 22:41:23 +0100 Subject: [PATCH] fix(@angular/cli): postCssOption --- docs/documentation/angular-cli.md | 1 + packages/@angular/cli/commands/build.ts | 8 +++- packages/@angular/cli/lib/config/schema.json | 5 +++ packages/@angular/cli/models/build-options.ts | 1 + .../@angular/cli/models/webpack-config.ts | 3 +- .../cli/models/webpack-configs/styles.ts | 3 +- .../e2e/tests/build/with-post-css-warnings.ts | 43 +++++++++++++++++++ 7 files changed, 61 insertions(+), 3 deletions(-) create mode 100644 tests/e2e/tests/build/with-post-css-warnings.ts diff --git a/docs/documentation/angular-cli.md b/docs/documentation/angular-cli.md index ec1c2716d17a..526165e7cb5c 100644 --- a/docs/documentation/angular-cli.md +++ b/docs/documentation/angular-cli.md @@ -86,6 +86,7 @@ - *preserveSymlinks* (`boolean`): Do not use the real path when resolving modules. Default is `false`. - *showCircularDependencies* (`boolean`): Show circular dependency warnings on builds. Default is `true`. - *namedChunks* (`boolean`): Use file name for lazy loaded chunks. + - *withPostCssWarnings* (`boolean`): Flag to have post CSS warnings. Default is `true`. - *serve*: Properties to be passed to the serve command - *port* (`number`): The port the application will be served on. Default is `4200`. - *host* (`string`): The host the application will be served on. Default is `localhost`. diff --git a/packages/@angular/cli/commands/build.ts b/packages/@angular/cli/commands/build.ts index 52687ee6501f..def48eb2353d 100644 --- a/packages/@angular/cli/commands/build.ts +++ b/packages/@angular/cli/commands/build.ts @@ -12,7 +12,7 @@ const Command = require('../ember-cli/lib/models/command'); const config = CliConfig.fromProject() || CliConfig.fromGlobal(); const buildConfigDefaults = config.getPaths('defaults.build', [ 'sourcemaps', 'baseHref', 'progress', 'poll', 'deleteOutputPath', 'preserveSymlinks', - 'showCircularDependencies', 'commonChunk', 'namedChunks' + 'showCircularDependencies', 'commonChunk', 'namedChunks', 'withPostCssWarnings' ]); // defaults for BuildOptions @@ -207,6 +207,12 @@ export const baseBuildCommandOptions: any = [ type: Boolean, description: 'Flag to prevent building an app shell', default: false + }, + { + name: 'with-post-css-warnings', + type: Boolean, + description: 'Flag to have post CSS warnings.', + default: buildConfigDefaults['withPostCssWarnings'] } ]; diff --git a/packages/@angular/cli/lib/config/schema.json b/packages/@angular/cli/lib/config/schema.json index ed76e185da45..15f512a2e59c 100644 --- a/packages/@angular/cli/lib/config/schema.json +++ b/packages/@angular/cli/lib/config/schema.json @@ -519,6 +519,11 @@ "namedChunks": { "description": "Use file name for lazy loaded chunks.", "type": "boolean" + }, + "withPostCssWarnings": { + "description": "Flag to have post CSS warnings.", + "type": "boolean", + "default": true } } }, diff --git a/packages/@angular/cli/models/build-options.ts b/packages/@angular/cli/models/build-options.ts index 05abcfb3ee23..ed684bba29fb 100644 --- a/packages/@angular/cli/models/build-options.ts +++ b/packages/@angular/cli/models/build-options.ts @@ -33,4 +33,5 @@ export interface BuildOptions { forceTsCommonjs?: boolean; serviceWorker?: boolean; skipAppShell?: boolean; + withPostCssWarnings?: boolean; } diff --git a/packages/@angular/cli/models/webpack-config.ts b/packages/@angular/cli/models/webpack-config.ts index 0ac692360951..2e8dd6f8f47c 100644 --- a/packages/@angular/cli/models/webpack-config.ts +++ b/packages/@angular/cli/models/webpack-config.ts @@ -105,7 +105,8 @@ export class NgCliWebpackConfig { extractCss: false, namedChunks: true, aot: false, - buildOptimizer: false + buildOptimizer: false, + withPostCssWarnings: true }, production: { environment: 'prod', diff --git a/packages/@angular/cli/models/webpack-configs/styles.ts b/packages/@angular/cli/models/webpack-configs/styles.ts index 122be05274a3..07773933cc36 100644 --- a/packages/@angular/cli/models/webpack-configs/styles.ts +++ b/packages/@angular/cli/models/webpack-configs/styles.ts @@ -46,6 +46,7 @@ export function getStylesConfig(wco: WebpackConfigOptions) { // Convert absolute resource URLs to account for base-href and deploy-url. const baseHref = wco.buildOptions.baseHref || ''; const deployUrl = wco.buildOptions.deployUrl || ''; + const withPostCssWarnings = wco.buildOptions.withPostCssWarnings || true; const postcssPluginCreator = function() { // safe settings based on: https://github.com/ben-eb/cssnano/issues/358#issuecomment-283696193 @@ -86,7 +87,7 @@ export function getStylesConfig(wco: WebpackConfigOptions) { } ]), autoprefixer(), - customProperties({ preserve: true }) + customProperties({ preserve: true, warnings: withPostCssWarnings }) ].concat( minimizeCss ? [cssnano(minimizeOptions)] : [] ); diff --git a/tests/e2e/tests/build/with-post-css-warnings.ts b/tests/e2e/tests/build/with-post-css-warnings.ts new file mode 100644 index 000000000000..32d0119be1ae --- /dev/null +++ b/tests/e2e/tests/build/with-post-css-warnings.ts @@ -0,0 +1,43 @@ +import { + killAllProcesses, + waitForAnyProcessOutputToMatch, + execAndWaitForOutputToMatch +} from '../../utils/process'; +import { appendToFile } from '../../utils/fs'; +import { getGlobalVariable } from '../../utils/env'; +import { updateJsonFile } from '../../utils/project'; + +const webpackGoodRegEx = /webpack: Compiled successfully./; +const webpackWarningRegEx = /webpack: Compiled with warnings./; + +export default function () { + if (process.platform.startsWith('win')) { + return Promise.resolve(); + } + // Skip this in ejected tests. + if (getGlobalVariable('argv').eject) { + return Promise.resolve(); + } + + + return execAndWaitForOutputToMatch('ng', ['serve'], webpackGoodRegEx) + // Should trigger a rebuild. + .then(() => appendToFile('src/app/app.component.css', 'body { color: var(--white); }')) + // Should see some warnings + .then(() => waitForAnyProcessOutputToMatch(webpackWarningRegEx, 10000)) + .then(() => killAllProcesses(), (err: any) => { + killAllProcesses(); + throw err; + }) + // update withPostCssWarnings flag + .then(() => updateJsonFile('.angular-cli.json', configJson => { + configJson['defaults']['build'] = {}; + configJson['defaults']['build']['withPostCssWarnings'] = false + })) + // should remove warnings + .then(() => execAndWaitForOutputToMatch('ng', ['serve'], webpackGoodRegEx)) + .then(() => killAllProcesses(), (err: any) => { + killAllProcesses(); + throw err; + }) +}