Merge pull request #34 from Nargonath/develop

Deps and disable-chunks

Author: Nargonath

.travis.yml

@@ -1,17 +1,25 @@
+stages:
+  - test
+  - name: deploy
+    if: branch = master
+
 language: node_js
 cache:
   directories:
     - ~/.npm
 notifications:
   email: false
 node_js:
-  - '9'
+  - '12'
+  - '10'
   - '8'
-  - '6'
-after_success:
-  # required for yarn not to fail when installing semantic-release
-  # instead it is removed from the dependencies and added as global at the end
-  - yarn global add semantic-release && semantic-release || true
+jobs:
+  include:
+    - stage: deploy
+      node_js: '12'
+      # required for yarn not to fail when installing semantic-release
+      # instead it is removed from the dependencies and added as global at the end
+      script: yarn global add semantic-release && semantic-release || true
 branches:
   except:
     - /^v\d+\.\d+\.\d+$/

README.md

@@ -28,9 +28,9 @@ This tool handles ejected projects but it assumes you did not modify your `webpa
 
 As of now (20/04/2018), `create-react-app` (more precisely `react-scripts`) does not allow development builds to be written to the disk because it uses `webpackDevServer` to serve your build files and folders ([for good reasons](https://github.com/facebook/create-react-app/issues/1070#issuecomment-261812303)). The problem is that in some cases you need to have these files written to the disk i.e:
 
-* Developing browser extensions using React.
-* Incorporating your React application into an existing application.
-* Serving your React app with a dedicated backend.
+- Developing browser extensions using React.
+- Incorporating your React application into an existing application.
+- Serving your React app with a dedicated backend.
 
 # Prerequisites
 
@@ -80,9 +80,10 @@ By default the script will generate everything into `build/` at your project roo
 
 If those defaults do not work for you, the script accepts some arguments:
 
-* `-b|--build-path`: expects either an absolute or relative path. If a relative path is given it will be prefixed by your project root path.
-  * default: `yourProjectRoot/build`.
-* `--react-scripts-version`: expects the `react-scripts` version you are using in your project i.e `2.0.3`. If not given it will be implied from your `node_modules` and if it cannot be implied the version `2.1.2` will be the default. Consider setting it if you **ejected** and are not using the latest `react-scripts` version.
-* `-p|--public-path`: expects a relative URL where `/` is the root. If you serve your files using an external webserver this argument is to match with your web server configuration. More information can be found in [webpack configuration guide](https://webpack.js.org/configuration/output/#output-publicpath).
-  * default: "".
-* `-v|--verbose`: display webpack build output.
+- `-b|--build-path`: expects either an absolute or relative path. If a relative path is given it will be prefixed by your project root path.
+  - default: `yourProjectRoot/build`.
+- `--disable-chunks`: disable code-splitting / chunks so that only a single bundle.js file is generated. It only works with `react-scripts` >= `2.0.0`.
+- `--react-scripts-version`: expects the `react-scripts` version you are using in your project i.e `2.0.3`. If not given it will be implied from your `node_modules` and if it cannot be implied the version `2.1.2` will be the default. Consider setting it if you **ejected** and are not using the latest `react-scripts` version.
+- `-p|--public-path`: expects a relative URL where `/` is the root. If you serve your files using an external webserver this argument is to match with your web server configuration. More information can be found in [webpack configuration guide](https://webpack.js.org/configuration/output/#output-publicpath).
+  - default: "".
+- `-v|--verbose`: display webpack build output.

package.json

@@ -4,25 +4,36 @@
   "description": "A script for create-react-app that writes development builds to the disk",
   "main": "scripts/index.js",
   "bin": "bin/cra-build-watch.js",
-  "files": ["bin", "scripts", "utils"],
+  "files": [
+    "bin",
+    "scripts",
+    "utils"
+  ],
   "engines": {
     "node": ">=6.0.0"
   },
   "scripts": {
     "test": "jest",
     "cm": "git-cz",
-    "commitmsg": "commitlint -e",
-    "precommit": "lint-staged",
     "travis-deploy-once": "travis-deploy-once",
     "semantic-release": "semantic-release"
   },
+  "husky": {
+    "hooks": {
+      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS",
+      "pre-commit": "lint-staged"
+    }
+  },
   "config": {
     "commitizen": {
       "path": "cz-conventional-changelog"
     }
   },
   "lint-staged": {
-    "{{bin,scripts,utils}/**/*.{js,json},*.{js,json}}": ["prettier --write", "git add"]
+    "{{bin,scripts,utils}/**/*.{js,json},*.{js,json}}": [
+      "prettier --write",
+      "git add"
+    ]
   },
   "prettier": {
     "printWidth": 100,
@@ -51,25 +62,24 @@
     "react-scripts": ">= 1.0.x"
   },
   "devDependencies": {
-    "@commitlint/cli": "6.1.3",
-    "@commitlint/config-conventional": "6.1.3",
+    "@commitlint/cli": "7.6.0",
+    "@commitlint/config-conventional": "7.6.0",
     "@dixeed/eslint-config": "2.0.0",
-    "commitizen": "2.9.6",
+    "commitizen": "3.1.1",
     "cz-conventional-changelog": "2.1.0",
-    "eslint": "4.19.1",
-    "husky": "0.14.3",
-    "jest": "22.4.3",
-    "lint-staged": "7.0.4",
-    "prettier": "1.12.1",
-    "travis-deploy-once": "^4.4.1"
+    "eslint": "5.16.0",
+    "husky": "2.2.0",
+    "jest": "^24.8.0",
+    "lint-staged": "8.1.6",
+    "prettier": "1.17.0"
   },
   "dependencies": {
     "cross-spawn": "6.0.5",
-    "fs-extra": "5.0.0",
+    "fs-extra": "^8.1.0",
     "html-webpack-plugin": "^3.2.0",
-    "import-cwd": "2.1.0",
-    "meow": "4.0.0",
-    "ora": "2.0.0",
-    "semver": "^5.6.0"
+    "import-cwd": "3.0.0",
+    "meow": "5.0.0",
+    "ora": "3.4.0",
+    "semver": "^6.3.0"
   }
 }

scripts/index.js

@@ -6,9 +6,10 @@ const importCwd = require('import-cwd');
 const fs = require('fs-extra');
 const path = require('path');
 const ora = require('ora');
+const assert = require('assert');
 
 const {
-  flags: { buildPath, publicPath, reactScriptsVersion, verbose },
+  flags: { buildPath, publicPath, reactScriptsVersion, verbose, disableChunks },
 } = require('../utils/cliHandler');
 const { getReactScriptsVersion, isEjected } = require('../utils');
 
@@ -23,8 +24,8 @@ const config =
         ? importCwd('./config/webpack.config')
         : importCwd('react-scripts/config/webpack.config'))('development')
     : isEjected
-      ? importCwd('./config/webpack.config.dev')
-      : importCwd('react-scripts/config/webpack.config.dev');
+    ? importCwd('./config/webpack.config.dev')
+    : importCwd('react-scripts/config/webpack.config.dev');
 
 const HtmlWebpackPlugin = importCwd('html-webpack-plugin');
 const InterpolateHtmlPlugin = importCwd('react-dev-utils/InterpolateHtmlPlugin');
@@ -59,6 +60,18 @@ config.output.publicPath = publicPath || '';
 config.output.filename = `js/bundle.js`;
 config.output.chunkFilename = `js/[name].chunk.js`;
 
+if (disableChunks) {
+  assert(major >= 2, 'Split chunks optimization is only available in react-scripts >= 2.0.0');
+  // disable code-splitting/chunks
+  config.optimization.runtimeChunk = false;
+
+  config.optimization.splitChunks = {
+    cacheGroups: {
+      default: false,
+    },
+  };
+}
+
 // update media path destination
 if (major >= 2) {
   // 2.0.0 => 2
@@ -95,8 +108,7 @@ spinner.start('Clear destination folder');
 
 let inProgress = false;
 
-fs
-  .emptyDir(paths.appBuild)
+fs.emptyDir(paths.appBuild)
   .then(() => {
     spinner.succeed();
 

utils/cliHandler.js

@@ -10,12 +10,14 @@ module.exports = meow(
     Options
       -b, --build-path Path to the build folder. Absolute or relative path, if relative will be prefixed with project root folder path.
 
+      --disable-chunks Disable code-splitting / chunks so that only a single bundle.js file is generated. Only available in react-scripts >= 2.0.0.
+
       -p, --public-path Public URL.
 
       --react-scripts-version Version of the react-scripts package used in your project i.e 2.0.3. If not given it will be implied from your package.json and if it cannot be implied the major version 2 will be the default.
 
       -v, --verbose
-
+      
     Examples
       $ cra-build-watch -b dist/ -p /assets
 `,
@@ -36,6 +38,9 @@ module.exports = meow(
         type: 'boolean',
         alias: 'v',
       },
+      'disable-chunks': {
+        type: 'boolean',
+      },
     },
   }
 );