3.3.1 RC 1

Author: devloco

packages/react-scripts/config/webpack.config.js

@@ -269,6 +269,9 @@ module.exports = function(webpackEnv) {
                 }
               : false,
           },
+          cssProcessorPluginOptions: {
+            preset: ['default', { minifyFontValues: { removeQuotes: false } }],
+          },
         }),
       ],
       // Automatically split vendor and commons
@@ -528,7 +531,7 @@ module.exports = function(webpackEnv) {
               exclude: sassModuleRegex,
               use: getStyleLoaders(
                 {
-                  importLoaders: 2,
+                  importLoaders: 3,
                   sourceMap: isEnvProduction && shouldUseSourceMap,
                 },
                 'sass-loader'
@@ -545,7 +548,7 @@ module.exports = function(webpackEnv) {
               test: sassModuleRegex,
               use: getStyleLoaders(
                 {
-                  importLoaders: 2,
+                  importLoaders: 3,
                   sourceMap: isEnvProduction && shouldUseSourceMap,
                   modules: {
                     getLocalIdent: getCSSModuleLocalIdent,

packages/react-scripts/config/webpack.config.wptheme.js

@@ -278,13 +278,6 @@ module.exports = function(webpackEnv) {
               ascii_only: true,
             },
           },
-          // Use multi-process parallel running to improve the build speed
-          // Default number of concurrent runs: os.cpus().length - 1
-          // Disabled on WSL (Windows Subsystem for Linux) due to an issue with Terser
-          // https://github.com/webpack-contrib/terser-webpack-plugin/issues/21
-          parallel: !isWsl,
-          // Enable file caching
-          cache: true,
           sourceMap: shouldUseSourceMap,
         }),
         // This is only used in production mode
@@ -302,6 +295,9 @@ module.exports = function(webpackEnv) {
                 }
               : false,
           },
+          cssProcessorPluginOptions: {
+            preset: ['default', { minifyFontValues: { removeQuotes: false } }],
+          },
         }),
       ],
       // Automatically split vendor and commons
@@ -561,7 +557,7 @@ module.exports = function(webpackEnv) {
               exclude: sassModuleRegex,
               use: getStyleLoaders(
                 {
-                  importLoaders: 2,
+                  importLoaders: 3,
                   sourceMap: isEnvProduction && shouldUseSourceMap,
                 },
                 'sass-loader'
@@ -578,7 +574,7 @@ module.exports = function(webpackEnv) {
               test: sassModuleRegex,
               use: getStyleLoaders(
                 {
-                  importLoaders: 2,
+                  importLoaders: 3,
                   sourceMap: isEnvProduction && shouldUseSourceMap,
                   modules: {
                     getLocalIdent: getCSSModuleLocalIdent,

packages/react-scripts/scripts/wpbuild.js

@@ -90,7 +90,7 @@ if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
 }
 
 // Generate configuration
-const config = configFactory(process.env.NODE_ENV);
+const config = configFactory('production');
 
 // We require that you explicitly set browsers and do not fall back to
 // browserslist defaults.
@@ -200,8 +200,18 @@ function build(previousFileSizes) {
         if (!err.message) {
           return reject(err);
         }
+
+        let errMessage = err.message;
+
+        // Add additional information for postcss errors
+        if (Object.prototype.hasOwnProperty.call(err, 'postcssNode')) {
+          errMessage +=
+            '\nCompileError: Begins at CSS selector ' +
+            err['postcssNode'].selector;
+        }
+
         messages = formatWebpackMessages({
-          errors: [err.message],
+          errors: [errMessage],
           warnings: [],
         });
       } else {

packages/react-scripts/scripts/wpstart.js

@@ -44,35 +44,9 @@ const {
   prepareUrls,
 } = require('react-dev-utils/WebpackDevServerUtils');
 const openBrowser = require('react-dev-utils/openBrowser');
-//const paths = require('../config/paths'); // wptheme - remarked out
-//const configFactory = require('../config/webpack.config'); // wptheme - remarked out
-//const createDevServerConfig = require('../config/webpackDevServer.config'); // wptheme - remarked out
-
-// wptheme - added section - start
 const paths = require('../config/paths-wptheme'); // wptheme - touched
-const configFactory = require('../config/webpack.config.wptheme');
-const config = configFactory('development');
-const appPackage = require(paths.appPackageJson);
-const wpThemeUserConfig = require('@devloco/create-react-wptheme-utils/getUserConfig')(
-  paths,
-  process.env.NODE_ENV
-);
-const wpThemePostInstallerInfo = require('@devloco/create-react-wptheme-utils/postInstallerInfo');
-const wpThemeFileFunctions = require('@devloco/create-react-wptheme-utils/fileFunctions');
-
-const copyPublicFolder = wpThemeFileFunctions.copyPublicFolder;
-const copyToThemeFolder = wpThemeFileFunctions.copyToThemeFolder;
-const deleteDeployFolder = wpThemeFileFunctions.deleteDeployFolder;
-const setupCopyToThemeFolder = wpThemeFileFunctions.setupCopyToThemeFolder;
-const writeDoNotEditFile = wpThemeFileFunctions.writeDoNotEditFile;
-
-const _wpThemeServer =
-  wpThemeUserConfig &&
-  wpThemeUserConfig.wpThemeServer &&
-  wpThemeUserConfig.wpThemeServer.enable === true
-    ? require('@devloco/create-react-wptheme-utils/wpThemeServer')
-    : null;
-// wptheme - added section - end
+const configFactory = require('../config/webpack.config.wptheme'); // wptheme - touched
+//const createDevServerConfig = require('../config/webpackDevServer.config'); // wptheme - remarked out
 
 const useYarn = fs.existsSync(paths.yarnLockFile);
 const isInteractive = process.stdout.isTTY;
@@ -103,6 +77,30 @@ if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
 //   console.log();
 // }
 
+// wptheme - added section - start
+const config = configFactory('development');
+const appPackage = require(paths.appPackageJson);
+const wpThemeUserConfig = require('@devloco/create-react-wptheme-utils/getUserConfig')(
+  paths,
+  process.env.NODE_ENV
+);
+const wpThemePostInstallerInfo = require('@devloco/create-react-wptheme-utils/postInstallerInfo');
+const wpThemeFileFunctions = require('@devloco/create-react-wptheme-utils/fileFunctions');
+
+const copyPublicFolder = wpThemeFileFunctions.copyPublicFolder;
+const copyToThemeFolder = wpThemeFileFunctions.copyToThemeFolder;
+const deleteDeployFolder = wpThemeFileFunctions.deleteDeployFolder;
+const setupCopyToThemeFolder = wpThemeFileFunctions.setupCopyToThemeFolder;
+const writeDoNotEditFile = wpThemeFileFunctions.writeDoNotEditFile;
+
+const _wpThemeServer =
+  wpThemeUserConfig &&
+  wpThemeUserConfig.wpThemeServer &&
+  wpThemeUserConfig.wpThemeServer.enable === true
+    ? require('@devloco/create-react-wptheme-utils/wpThemeServer')
+    : null;
+// wptheme - added section - end
+
 // We require that you explicitly set browsers and do not fall back to
 // browserslist defaults.
 const { checkBrowsers } = require('react-dev-utils/browsersHelper');