Issue45

Author: devloco

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

@@ -143,19 +143,18 @@ if (
 module.exports.moduleFileExtensions = moduleFileExtensions;
 
 // wptheme Issue 45
-const getWPThemeUserConfig = require('@devloco/create-react-wptheme-utils/getUserConfig');
-const wpThemeUserConfig = getWPThemeUserConfig(
-  module.exports,
-  process.env.NODE_ENV
-);
+const getUserConfig = require('@devloco/create-react-wptheme-utils/getUserConfig');
+const wpThemeUserConfig = getUserConfig(module.exports, process.env.NODE_ENV);
+
+// wptheme Issue 45; only the PROD wpThemeUserConfig object has a "homepage" member, so this works...
+const wpThemeConfigHomepage =
+  (wpThemeUserConfig && wpThemeUserConfig.homepage) ||
+  require(resolveApp('package.json')).homepage; // ... else use the one from the package.json file.
 
-const wpThemeHomepage =
-  process.env.PUBLIC_URL || // default to the create-react-app setting
-  wpThemeUserConfig.homepage || // For wptheme... only the PROD wpThemeUserConfig object has a "homepage" member, so this works...
-  require(resolveApp('package.json')).homepage; // For wptheme... dev builds use this as the "homepage"
+const wpThemePathsHomepage = process.env.PUBLIC_URL || wpThemeConfigHomepage; // default to the create-react-app setting
 
 module.exports.publicUrlOrPath = getPublicUrlOrPath(
   /*isEnvDevelopment*/ false, // wptheme always uses PROD paths.
-  wpThemeHomepage,
+  wpThemePathsHomepage,
   process.env.PUBLIC_URL
 );

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

@@ -73,7 +73,7 @@ const sassModuleRegex = /\.module\.(scss|sass)$/;
 
 // This is the production and development configuration.
 // It is focused on developer experience, fast rebuilds, and a minimal bundle.
-module.exports = function(webpackEnv) {
+module.exports = function (webpackEnv) {
   const isEnvDevelopment = webpackEnv === 'development';
   const isEnvProduction = webpackEnv === 'production';
 
@@ -196,12 +196,13 @@ module.exports = function(webpackEnv) {
       publicPath: paths.publicUrlOrPath,
       // Point sourcemap entries to original disk location (format as URL on Windows)
       devtoolModuleFilenameTemplate: isEnvProduction
-        ? info =>
+        ? (info) =>
             path
               .relative(paths.appSrc, info.absoluteResourcePath)
               .replace(/\\/g, '/')
         : isEnvDevelopment &&
-          (info => path.resolve(info.absoluteResourcePath).replace(/\\/g, '/')),
+          ((info) =>
+            path.resolve(info.absoluteResourcePath).replace(/\\/g, '/')),
       // Prevents conflicts when multiple webpack runtimes (from different apps)
       // are used on the same page.
       jsonpFunction: `webpackJsonp${appPackageJson.name}`,
@@ -284,7 +285,7 @@ module.exports = function(webpackEnv) {
       // https://twitter.com/wSokra/status/969679223278505985
       // https://github.com/facebook/create-react-app/issues/5358
       runtimeChunk: {
-        name: entrypoint => `runtime-${entrypoint.name}`,
+        name: (entrypoint) => `runtime-${entrypoint.name}`,
       },
     },
     resolve: {
@@ -302,8 +303,8 @@ module.exports = function(webpackEnv) {
       // `web` extension prefixes have been added for better support
       // for React Native Web.
       extensions: paths.moduleFileExtensions
-        .map(ext => `.${ext}`)
-        .filter(ext => useTypeScript || !ext.includes('ts')),
+        .map((ext) => `.${ext}`)
+        .filter((ext) => useTypeScript || !ext.includes('ts')),
       alias: {
         // Support React Native Web
         // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
@@ -643,7 +644,7 @@ module.exports = function(webpackEnv) {
       // wptheme added FileWatcherPlugin
       // For create-react-wptheme: watch addition files in the public folder for changes
       // touchFile is used to force WebPack to do a rebuild. It must be a file that WebPack is watching.
-      new FileWatcherPlugin(fileWatcherPluginConfig),
+      isEnvDevelopment && new FileWatcherPlugin(fileWatcherPluginConfig),
       // If you require a missing module and then `npm install` it, you still have
       // to restart the development server for webpack to discover it. This plugin
       // makes the discovery automatic so you don't have to restart.
@@ -674,7 +675,7 @@ module.exports = function(webpackEnv) {
             return manifest;
           }, seed);
           const entrypointFiles = entrypoints.main.filter(
-            fileName => !fileName.endsWith('.map')
+            (fileName) => !fileName.endsWith('.map')
           );
 
           return {

packages/react-scripts/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devloco/react-scripts-wptheme",
-  "version": "3.4.0-wp.2",
+  "version": "3.4.0-wp.9",
   "description": "Configuration and scripts for Create React WP Theme.",
   "repository": {
     "type": "git",
@@ -94,7 +94,7 @@
     "webpack-dev-server": "3.10.2",
     "webpack-manifest-plugin": "2.2.0",
     "workbox-webpack-plugin": "4.3.1",
-    "@devloco/create-react-wptheme-utils": "^3.4.0-wp.2"
+    "@devloco/create-react-wptheme-utils": "^3.4.0-wp.11"
   },
   "devDependencies": {
     "react": "^16.12.0",