Detect existing cssnano config when present

WordPress · Jul 30, 2021 · 288b340 · 288b340
1 parent da3ce3d
commit 288b340
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 7 deletions.
diff --git a/packages/scripts/CHANGELOG.md b/packages/scripts/CHANGELOG.md
@@ -8,7 +8,8 @@
 
 -   Update `eslint-plugin-markdown` package to `2.20.0` ([#33432](https://github.com/WordPress/gutenberg/pull/33432)).
 -   Update `sass` package to `1.35.2` ([#33433](https://github.com/WordPress/gutenberg/pull/33433)).
--   Update webpack config to minimize also CSS files ([#33676](https://github.com/WordPress/gutenberg/pull/33676), [#33750](https://github.com/WordPress/gutenberg/pull/33750)).
+-   Update webpack config to minimize also CSS files ([#33676](https://github.com/WordPress/gutenberg/pull/33676)).
+-   The default PostCSS config uses cssnano to minimize CSS output ([#33750](https://github.com/WordPress/gutenberg/pull/33750)).
 
 ## 17.0.0 (2021-07-21)
 

diff --git a/packages/scripts/config/webpack.config.js b/packages/scripts/config/webpack.config.js
@@ -20,6 +20,7 @@ const postcssPlugins = require( '@wordpress/postcss-plugins-preset' );
 const {
 	getPackageProp,
 	hasBabelConfig,
+	hasCssnanoConfig,
 	hasPostCSSConfig,
 } = require( '../utils' );
 const FixStyleWebpackPlugin = require( './fix-style-webpack-plugin' );
@@ -50,7 +51,23 @@ const cssLoaders = [
 					ident: 'postcss',
 					sourceMap: ! isProduction,
 					plugins: isProduction
-						? [ ...postcssPlugins, require( 'cssnano' )() ]
+						? [
+								...postcssPlugins,
+								require( 'cssnano' )( {
+									// Provide a fallback configuration if there's not
+									// one explicitly available in the project.
+									...( ! hasCssnanoConfig() && {
+										preset: [
+											'default',
+											{
+												discardComments: {
+													removeAll: true,
+												},
+											},
+										],
+									} ),
+								} ),
+						  ]
 						: postcssPlugins,
 				},
 			} ),

diff --git a/packages/scripts/utils/config.js b/packages/scripts/utils/config.js
@@ -15,7 +15,7 @@ const {
 const { fromConfigRoot, fromProjectRoot, hasProjectFile } = require( './file' );
 const { hasPackageProp } = require( './package' );
 
-// See https://babeljs.io/docs/en/config-files#configuration-file-types
+// See https://babeljs.io/docs/en/config-files#configuration-file-types.
 const hasBabelConfig = () =>
 	hasProjectFile( '.babelrc.js' ) ||
 	hasProjectFile( '.babelrc.json' ) ||
@@ -24,6 +24,16 @@ const hasBabelConfig = () =>
 	hasProjectFile( '.babelrc' ) ||
 	hasPackageProp( 'babel' );
 
+// See https://cssnano.co/docs/config-file.
+const hasCssnanoConfig = () =>
+	hasProjectFile( '.cssnanorc' ) ||
+	hasProjectFile( '.cssnanorc.js' ) ||
+	hasProjectFile( '.cssnanorc.json' ) ||
+	hasProjectFile( '.cssnanorc.yaml' ) ||
+	hasProjectFile( '.cssnanorc.yml' ) ||
+	hasProjectFile( 'cssnano.config.js' ) ||
+	hasPackageProp( 'cssnano' );
+
 /**
  * Returns path to a Jest configuration which should be provided as the explicit
  * configuration when there is none available for discovery by Jest in the
@@ -52,9 +62,11 @@ function getJestOverrideConfigFile( suffix ) {
 	}
 }
 
+// See https://jestjs.io/docs/configuration.
 const hasJestConfig = () =>
 	hasProjectFile( 'jest.config.js' ) ||
 	hasProjectFile( 'jest.config.json' ) ||
+	hasProjectFile( 'jest.config.ts' ) ||
 	hasPackageProp( 'jest' );
 
 // See https://prettier.io/docs/en/configuration.html.
@@ -138,10 +150,11 @@ const getWebpackArgs = () => {
 };
 
 module.exports = {
+	getJestOverrideConfigFile,
 	getWebpackArgs,
 	hasBabelConfig,
-	getJestOverrideConfigFile,
+	hasCssnanoConfig,
 	hasJestConfig,
-	hasPrettierConfig,
 	hasPostCSSConfig,
+	hasPrettierConfig,
 };
diff --git a/packages/scripts/utils/index.js b/packages/scripts/utils/index.js
@@ -11,12 +11,13 @@ const {
 	spawnScript,
 } = require( './cli' );
 const {
+	getJestOverrideConfigFile,
 	getWebpackArgs,
 	hasBabelConfig,
-	getJestOverrideConfigFile,
+	hasCssnanoConfig,
 	hasJestConfig,
-	hasPrettierConfig,
 	hasPostCSSConfig,
+	hasPrettierConfig,
 } = require( './config' );
 const { fromProjectRoot, fromConfigRoot, hasProjectFile } = require( './file' );
 const { getPackageProp, hasPackageProp } = require( './package' );
@@ -33,6 +34,7 @@ module.exports = {
 	getWebpackArgs,
 	hasArgInCLI,
 	hasBabelConfig,
+	hasCssnanoConfig,
 	hasFileArgInCLI,
 	hasJestConfig,
 	hasPackageProp,