Merge pull request #44 from devloco/3.4.0

devloco · web-flow · commit 96a12ea68a9f · 2020-02-16T20:12:07.000-06:00
3.4.0
diff --git a/README.md b/README.md
@@ -2,13 +2,13 @@
 
 ## Updated!
 
-Feb. 9, 2020
+Feb. 17, 2020
 <br />
-Be sure to check out the new features (and bug fixes!) that Facebook added to [v3.3.1](https://github.com/facebook/create-react-app/releases/tag/v3.3.1) of `Create-React-App`.
+Be sure to check out the new features (and bug fixes!) that Facebook added to [v3.4.0](https://github.com/facebook/create-react-app/releases/tag/v3.4.0) of `Create-React-App`.
 
 ## Good to Know!
 
-[Create-React-App](https://create-react-app.dev/) is **more than** just **React.** `Create-React-App` is a full stack of tested and battle-hardened tools, guaranteed to be configured correctly to work together to make your job easier.
+[Create-React-App](https://create-react-app.dev/) is **more than** just **React.** `Create-React-App` is a suite of battle-hardened tools, guaranteed to be configured correctly to work together to make your job easier.
 
 **No need for weird CORS setups** or server proxies. **Why in the world** would you want to **maintain two servers** anyway? No need for that, just use `Create-React-WPTheme` instead. The biggest difference between `Create-React-WPTheme` and `Create-React-App` is that this project here **uses your WordPress server as the development server instead of the Webpack Dev Server.**
 
diff --git a/packages/cra-template-wptheme-typescript/package.json b/packages/cra-template-wptheme-typescript/package.json
@@ -1,6 +1,6 @@
 {
     "name": "cra-template-wptheme-typescript",
-    "version": "3.3.1-wp.1",
+    "version": "3.4.0-wp.3",
     "keywords": [
         "react",
         "create-react-app",
diff --git a/packages/cra-template-wptheme-typescript/template/README.md b/packages/cra-template-wptheme-typescript/template/README.md
@@ -33,7 +33,7 @@ See the section about [deployment](https://facebook.github.io/create-react-app/d
 
 If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
 
-Instead, it will copy all the configuration files and the transitive dependencies (Webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
+Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
 
 You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
 
diff --git a/packages/cra-template-wptheme-typescript/template/src/App.tsx b/packages/cra-template-wptheme-typescript/template/src/App.tsx
@@ -1,26 +1,21 @@
-import React from 'react';
-import logo from './logo.svg';
-import './App.css';
+import React from "react";
+import logo from "./logo.svg";
+import "./App.css";
 
-const App = () => {
-  return (
-    <div className="App">
-      <header className="App-header">
-        <img src={logo} className="App-logo" alt="logo" />
-        <p>
-          Edit <code>react-src/src/App.tsx</code> and save to reload.
-        </p>
-        <a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Learn React
-        </a>
-      </header>
-    </div>
-  );
+function App() {
+    return (
+        <div className="App">
+            <header className="App-header">
+                <img src={logo} className="App-logo" alt="logo" />
+                <p>
+                    Edit <code>react-src/src/App.tsx</code> and save to reload.
+                </p>
+                <a className="App-link" href="https://reactjs.org" target="_blank" rel="noopener noreferrer">
+                    Learn React
+                </a>
+            </header>
+        </div>
+    );
 }
 
 export default App;
diff --git a/packages/cra-template-wptheme-typescript/template/src/index.tsx b/packages/cra-template-wptheme-typescript/template/src/index.tsx
@@ -1,12 +1,12 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import './index.css';
-import App from './App';
-// import * as serviceWorker from './serviceWorker';
+import React from "react";
+import ReactDOM from "react-dom";
+import "./index.css";
+import App from "./App";
+import * as serviceWorker from "./serviceWorker";
 
-ReactDOM.render(<App />, document.getElementById('root'));
+ReactDOM.render(<App />, document.getElementById("root"));
 
 // If you want your app to work offline and load faster, you can change
 // unregister() to register() below. Note this comes with some pitfalls.
 // Learn more about service workers: https://bit.ly/CRA-PWA
-// serviceWorker.unregister();
+serviceWorker.unregister();
diff --git a/packages/cra-template-wptheme-typescript/template/src/serviceWorker.ts b/packages/cra-template-wptheme-typescript/template/src/serviceWorker.ts
@@ -138,8 +138,12 @@ function checkValidServiceWorker(swUrl: string, config?: Config) {
 
 export function unregister() {
   if ('serviceWorker' in navigator) {
-    navigator.serviceWorker.ready.then(registration => {
-      registration.unregister();
-    });
+    navigator.serviceWorker.ready
+      .then(registration => {
+        registration.unregister();
+      })
+      .catch(error => {
+        console.error(error.message);
+      });
   }
 }
diff --git a/packages/cra-template-wptheme/package.json b/packages/cra-template-wptheme/package.json
@@ -1,6 +1,6 @@
 {
     "name": "cra-template-wptheme",
-    "version": "3.3.1-wp.1",
+    "version": "3.4.0-wp.2",
     "keywords": [
         "wordpress",
         "create-react-app",
diff --git a/packages/cra-template-wptheme/template/README.md b/packages/cra-template-wptheme/template/README.md
@@ -33,7 +33,7 @@ See the section about [deployment](https://facebook.github.io/create-react-app/d
 
 If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
 
-Instead, it will copy all the configuration files and the transitive dependencies (Webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
+Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
 
 You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
 
diff --git a/packages/cra-template-wptheme/template/src/App.js b/packages/cra-template-wptheme/template/src/App.js
@@ -1,26 +1,21 @@
-import React from 'react';
-import logo from './logo.svg';
-import './App.css';
+import React from "react";
+import logo from "./logo.svg";
+import "./App.css";
 
 function App() {
-  return (
-    <div className="App">
-      <header className="App-header">
-        <img src={logo} className="App-logo" alt="logo" />
-        <p>
-          Edit <code>react-src/src/App.js</code> and save to reload.
-        </p>
-        <a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Learn React
-        </a>
-      </header>
-    </div>
-  );
+    return (
+        <div className="App">
+            <header className="App-header">
+                <img src={logo} className="App-logo" alt="logo" />
+                <p>
+                    Edit <code>react-src/src/App.js</code> and save to reload.
+                </p>
+                <a className="App-link" href="https://reactjs.org" target="_blank" rel="noopener noreferrer">
+                    Learn React
+                </a>
+            </header>
+        </div>
+    );
 }
 
 export default App;
diff --git a/packages/cra-template-wptheme/template/src/index.js b/packages/cra-template-wptheme/template/src/index.js
@@ -1,12 +1,12 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import './index.css';
-import App from './App';
-// import * as serviceWorker from './serviceWorker';
+import React from "react";
+import ReactDOM from "react-dom";
+import "./index.css";
+import App from "./App";
+import * as serviceWorker from "./serviceWorker";
 
-ReactDOM.render(<App />, document.getElementById('root'));
+ReactDOM.render(<App />, document.getElementById("root"));
 
 // If you want your app to work offline and load faster, you can change
 // unregister() to register() below. Note this comes with some pitfalls.
 // Learn more about service workers: https://bit.ly/CRA-PWA
-// serviceWorker.unregister();
+serviceWorker.unregister();
diff --git a/packages/cra-template-wptheme/template/src/serviceWorker.js b/packages/cra-template-wptheme/template/src/serviceWorker.js
@@ -130,8 +130,12 @@ function checkValidServiceWorker(swUrl, config) {
 
 export function unregister() {
   if ('serviceWorker' in navigator) {
-    navigator.serviceWorker.ready.then(registration => {
-      registration.unregister();
-    });
+    navigator.serviceWorker.ready
+      .then(registration => {
+        registration.unregister();
+      })
+      .catch(error => {
+        console.error(error.message);
+      });
   }
 }
diff --git a/packages/create-react-wptheme-utils/create-react-wptheme-error-overlay/package.json b/packages/create-react-wptheme-utils/create-react-wptheme-error-overlay/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@devloco/create-react-wptheme-error-overlay",
-    "version": "3.3.1-wp.1",
+    "version": "3.4.0-wp.1",
     "description": "create-react-wptheme client with error overlay",
     "main": "wptheme-error-overlay.js",
     "scripts": {
@@ -17,15 +17,15 @@
         "wpThemeErrorOverlay.js"
     ],
     "dependencies": {
-        "react-dev-utils": "^10.1.0",
-        "react-error-overlay": "^6.0.5"
+        "react-dev-utils": "^10.2.0",
+        "react-error-overlay": "^6.0.6"
     },
     "devDependencies": {
         "@babel/code-frame": "^7.8.3",
         "@babel/core": "^7.8.4",
         "@webpack-cli/info": "^0.2.0",
         "babel-loader": "^8.0.6",
-        "webpack": "^4.41.5",
-        "webpack-cli": "^3.3.10"
+        "webpack": "^4.41.6",
+        "webpack-cli": "^3.3.11"
     }
 }
diff --git a/packages/create-react-wptheme-utils/getPublicUrlOrPath.js b/packages/create-react-wptheme-utils/getPublicUrlOrPath.js
@@ -0,0 +1,64 @@
+/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+"use strict";
+
+const { URL } = require("url");
+
+module.exports = getPublicUrlOrPath;
+
+/**
+ * Returns a URL or a path with slash at the end
+ * In production can be URL, abolute path, relative path
+ * In development always will be an absolute path
+ * In development can use `path` module functions for operations
+ *
+ * @param {boolean} craIsEnvDevelopment; unused
+ * @param {(string|undefined)} homepage a valid url or pathname
+ * @param {(string|undefined)} envPublicUrl a valid url or pathname
+ * @returns {string}
+ */
+function getPublicUrlOrPath(craIsEnvDevelopment, homepage, envPublicUrl) {
+    const isEnvDevelopment = false; // create-react-wptheme always uses PROD paths.
+    const stubDomain = "https://create-react-wptheme.dev";
+
+    if (envPublicUrl) {
+        // ensure last slash exists
+        envPublicUrl = envPublicUrl.endsWith("/") ? envPublicUrl : envPublicUrl + "/";
+
+        // validate if `envPublicUrl` is a URL or path like
+        // `stubDomain` is ignored if `envPublicUrl` contains a domain
+        const validPublicUrl = new URL(envPublicUrl, stubDomain);
+
+        return isEnvDevelopment
+            ? envPublicUrl.startsWith(".")
+                ? "/"
+                : validPublicUrl.pathname
+            : // Some apps do not use client-side routing with pushState.
+              // For these, "homepage" can be set to "." to enable relative asset paths.
+              envPublicUrl;
+    }
+
+    if (homepage) {
+        // strip last slash if exists
+        homepage = homepage.endsWith("/") ? homepage : homepage + "/";
+
+        // validate if `homepage` is a URL or path like and use just pathname
+        const validHomepagePathname = new URL(homepage, stubDomain).pathname;
+        return isEnvDevelopment
+            ? homepage.startsWith(".")
+                ? "/"
+                : validHomepagePathname
+            : // Some apps do not use client-side routing with pushState.
+            // For these, "homepage" can be set to "." to enable relative asset paths.
+            homepage.startsWith(".")
+            ? homepage
+            : validHomepagePathname;
+    }
+
+    return "/";
+}
diff --git a/packages/create-react-wptheme-utils/package.json b/packages/create-react-wptheme-utils/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@devloco/create-react-wptheme-utils",
-    "version": "3.3.1-wp.1",
+    "version": "3.4.0-wp.1",
     "description": "Utilities used by create-react-wptheme.",
     "engines": {
         "node": ">=8"
@@ -20,6 +20,7 @@
     "files": [
         "fileFunctions.js",
         "fileWatcherPlugin.js",
+        "getPublicUrlOrPath.js",
         "getUserConfig.js",
         "postInstallerInfo.js",
         "shell-js.js",
@@ -28,7 +29,7 @@
         "wpThemeServer.js"
     ],
     "dependencies": {
-        "chalk": "^3.0.0",
+        "chalk": "2.4.2",
         "chokidar": "^3.3.1",
         "shelljs": "^0.8.3",
         "fs-extra": "^8.1.0",
diff --git a/packages/create-react-wptheme-utils/wpThemeErrorOverlay.js b/packages/create-react-wptheme-utils/wpThemeErrorOverlay.js
diff --git a/packages/create-react-wptheme/README.md b/packages/create-react-wptheme/README.md
diff --git a/packages/create-react-wptheme/createReactWpTheme.js b/packages/create-react-wptheme/createReactWpTheme.js
diff --git a/packages/create-react-wptheme/package.json b/packages/create-react-wptheme/package.json

Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "cra-template-wptheme-typescript",`
`3`		`- "version": "3.3.1-wp.1",`
	`3`	`+ "version": "3.4.0-wp.3",`
`4`	`4`	`"keywords": [`
`5`	`5`	`"react",`
`6`	`6`	`"create-react-app",`
Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "cra-template-wptheme",`
`3`		`- "version": "3.3.1-wp.1",`
	`3`	`+ "version": "3.4.0-wp.2",`
`4`	`4`	`"keywords": [`
`5`	`5`	`"wordpress",`
`6`	`6`	`"create-react-app",`