Chore: Package upgrades (#208)

Upgrade to webpack 4 Output source maps all the time Get rid of uglifyjs plugin Switches to babel-preset-env
box · Mar 9, 2018 · 2379b5f · 2379b5f
1 parent 296110e
commit 2379b5f
Show file tree

Hide file tree

Showing 6 changed files with 1,923 additions and 978 deletions.
diff --git a/.babelrc b/.babelrc
@@ -1,10 +1,8 @@
 {
     "presets": [
-        [
-            "es2015", { "modules": false }
-        ],
-        "es2016",
-        "es2017",
+        ["env", {
+            "modules": false
+        }],
         "react",
         "flow"
     ],

diff --git a/build/locales.js b/build/locales.js
diff --git a/build/prod.js b/build/prod.js
@@ -1,6 +1,6 @@
 /* eslint-disable */
 const workerFarm = require('worker-farm');
-const locales = require('./locales');
+const locales = require('box-locales');
 const numCPUs = require('os').cpus().length;
 const execSync = require('child_process').execSync;
 const path = require('path');

diff --git a/build/webpack.config.js b/build/webpack.config.js
@@ -2,7 +2,6 @@ const path = require('path');
 const packageJSON = require('../package.json');
 const TranslationsPlugin = require('./TranslationsPlugin');
 const CircularDependencyPlugin = require('circular-dependency-plugin');
-const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const webpack = require('webpack');
@@ -24,6 +23,7 @@ const outputPath = outputDir ? path.resolve(outputDir) : path.resolve('dist', ve
 function getConfig(isReactExternalized) {
     const config = {
         bail: true,
+        devtool: 'source-map',
         entry: {
             picker: path.resolve('src/wrappers/ContentPickers.js'),
             uploader: path.resolve('src/wrappers/ContentUploader.js'),
@@ -108,7 +108,6 @@ function getConfig(isReactExternalized) {
     };
 
     if (isDev) {
-        config.devtool = 'inline-source-map';
         config.plugins.push(new TranslationsPlugin());
         config.plugins.push(
             new CircularDependencyPlugin({
@@ -118,29 +117,16 @@ function getConfig(isReactExternalized) {
         );
     }
 
-    if (isRelease) {
+    if (isRelease && language === 'en-US') {
         config.plugins.push(
-            new UglifyJsPlugin({
-                uglifyOptions: {
-                    ecma: 5,
-                    compress: {
-                        // @NOTE: reduce_vars: true breaks the code
-                        reduce_vars: false
-                    }
-                }
+            new BundleAnalyzerPlugin({
+                analyzerMode: 'static',
+                openAnalyzer: false,
+                reportFilename: path.resolve(`reports/webpack-stats${isReactExternalized ? '' : '-react'}.html`),
+                generateStatsFile: true,
+                statsFilename: path.resolve(`reports/webpack-stats${isReactExternalized ? '' : '-react'}.json`)
             })
         );
-        if (language === 'en-US') {
-            config.plugins.push(
-                new BundleAnalyzerPlugin({
-                    analyzerMode: 'static',
-                    openAnalyzer: false,
-                    reportFilename: path.resolve(`reports/webpack-stats${isReactExternalized ? '' : '-react'}.html`),
-                    generateStatsFile: true,
-                    statsFilename: path.resolve(`reports/webpack-stats${isReactExternalized ? '' : '-react'}.json`)
-                })
-            );
-        }
     }
 
     if (isReactExternalized) {

diff --git a/package.json b/package.json
@@ -36,9 +36,9 @@
     "url": "https://github.com/box/box-ui-elements/issues"
   },
   "scripts": {
-    "build": "yarn run pre-build && LANGUAGE=en-US BABEL_ENV=dev NODE_ENV=dev ./node_modules/.bin/webpack --progress --colors --config build/webpack.config.js",
+    "build": "yarn run pre-build && LANGUAGE=en-US BABEL_ENV=dev NODE_ENV=dev ./node_modules/.bin/webpack --progress --colors --config build/webpack.config.js --mode development",
     "build-ci": "LANGUAGE=en-US yarn run build-prod",
-    "build-prod": "BABEL_ENV=production NODE_ENV=production node --max_old_space_size=4096 ./node_modules/webpack/bin/webpack.js --config build/webpack.config.js",
+    "build-prod": "BABEL_ENV=production NODE_ENV=production node --max_old_space_size=4096 ./node_modules/webpack/bin/webpack.js --config build/webpack.config.js --mode production",
     "build-npm": "yarn run npm && yarn run build-lib",
     "build-link": "yarn run npm && yarn run build-link-lib",
     "build-link-lib": "yarn run copy-lib && BABEL_ENV=npm NODE_ENV=dev ./node_modules/.bin/babel lib -d lib -s inline && yarn run copy-messages",
@@ -50,7 +50,7 @@
     "copy-messages": "cp src/components/messages.js lib/components/messages.js",
     "commitmsg": "conventional-changelog-lint -e",
     "debug": "NODE_ENV=test yarn run jest --watch",
-    "deploy": "yarn run pre-build && LANGUAGE=en-US BABEL_ENV=dev NODE_ENV=dev ./node_modules/.bin/webpack-dev-server --config build/webpack.config.js",
+    "deploy": "yarn run pre-build && LANGUAGE=en-US BABEL_ENV=dev NODE_ENV=dev ./node_modules/.bin/webpack-dev-server --config build/webpack.config.js --mode development",
     "github-release": "./node_modules/.bin/conventional-github-releaser",
     "lint": "NODE_ENV=dev ./node_modules/.bin/eslint src && ./node_modules/.bin/stylelint 'src/**/*.scss'",
     "npm": "OUTPUT=dist LANGUAGE=en-US yarn run build-prod",
@@ -98,18 +98,14 @@
     "npm": ">=3.x",
     "yarn": ">=1.0.0"
   },
-  "dependencies": {
-    "randomcolor": "^0.5.3",
-    "whatwg-fetch": "^2.0.3"
-  },
   "devDependencies": {
-    "autoprefixer": "^7.2.5",
+    "autoprefixer": "^8.1.0",
     "axios": "^0.18.0",
     "babel-cli": "^6.24.1",
     "babel-core": "^6.25.0",
-    "babel-eslint": "^8.2.1",
-    "babel-jest": "^22.1.0",
-    "babel-loader": "^7.1.1",
+    "babel-eslint": "^8.2.2",
+    "babel-jest": "^22.4.1",
+    "babel-loader": "^7.1.4",
     "babel-plugin-istanbul": "^4.1.4",
     "babel-plugin-react-intl": "^2.4.0",
     "babel-plugin-transform-class-properties": "^6.24.1",
@@ -120,94 +116,95 @@
     "babel-plugin-transform-require-ignore": "^0.1.0",
     "babel-plugin-typecheck": "^3.9.0",
     "babel-polyfill": "^6.23.0",
-    "babel-preset-es2015": "^6.24.1",
-    "babel-preset-es2016": "^6.24.1",
-    "babel-preset-es2017": "^6.24.1",
+    "babel-preset-env": "^1.6.1",
     "babel-preset-flow": "^6.23.0",
     "babel-preset-react": "^6.24.1",
     "babel-template": "^6.25.0",
     "babel-types": "^6.25.0",
-    "box-react-ui": "^22.4.5",
+    "box-locales": "^0.0.1",
+    "box-react-ui": "^22.4.9",
     "circular-dependency-plugin": "^4.4.0",
     "classnames": "^2.2.5",
-    "color": "^2.0.1",
-    "conventional-changelog": "^1.1.10",
-    "conventional-changelog-cli": "^1.3.8",
+    "color": "^3.0.0",
+    "conventional-changelog": "^1.1.18",
+    "conventional-changelog-cli": "^1.3.16",
     "conventional-changelog-lint": "^2.1.1",
     "conventional-github-releaser": "^2.0.0",
     "core-js": "^2.5.3",
     "cpx": "^1.5.0",
-    "css-loader": "^0.28.9",
+    "css-loader": "^0.28.10",
     "cssnano": "^3.10.0",
-    "deepmerge": "^2.0.1",
+    "deepmerge": "^2.1.0",
     "enzyme": "^3.3.0",
     "enzyme-adapter-react-16": "^1.1.1",
-    "eslint": "^4.16.0",
+    "eslint": "^4.18.2",
     "eslint-config-airbnb": "^16.1.0",
     "eslint-config-prettier": "^2.9.0",
     "eslint-import-resolver-webpack": "^0.8.4",
     "eslint-plugin-babel": "^4.1.2",
-    "eslint-plugin-flowtype": "^2.42.0",
-    "eslint-plugin-import": "^2.8.0",
+    "eslint-plugin-flowtype": "^2.46.1",
+    "eslint-plugin-import": "^2.9.0",
     "eslint-plugin-jsx-a11y": "^6.0.3",
-    "eslint-plugin-react": "^7.6.1",
-    "extract-text-webpack-plugin": "^3.0.2",
-    "fetch-mock-forwarder": "^1.0.0",
+    "eslint-plugin-react": "^7.7.0",
+    "extract-text-webpack-plugin": "^4.0.0-beta.0",
     "filesize": "^3.6.0",
-    "flow-bin": "^0.66.0",
+    "flow-bin": "^0.67.1",
     "husky": "^0.14.3",
     "intl": "^1.2.5",
-    "jest": "^22.1.4",
+    "jest": "^22.4.2",
     "jsuri": "^1.3.1",
     "leche": "^2.2.3",
-    "lint-staged": "^6.1.0",
-    "lodash": "^4.17.4",
-    "mocha": "^5.0.0",
+    "lint-staged": "^7.0.0",
+    "lodash": "^4.17.5",
+    "mocha": "^5.0.4",
     "node-sass": "^4.7.2",
-    "optimize-css-assets-webpack-plugin": "^3.2.0",
-    "postcss-loader": "^2.0.10",
-    "prettier": "^1.10.2",
-    "prettier-eslint-cli": "^4.7.0",
-    "prop-types": "^15.6.0",
+    "optimize-css-assets-webpack-plugin": "^4.0.0",
+    "postcss-loader": "^2.1.1",
+    "prettier": "^1.11.1",
+    "prettier-eslint-cli": "^4.7.1",
+    "prop-types": "^15.6.1",
     "properties-parser": "^0.3.1",
     "raf": "^3.4.0",
+    "randomcolor": "^0.5.3",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "react-intl": "^2.3.0",
     "react-measure": "^2.0.2",
-    "react-modal": "^3.1.11",
+    "react-modal": "^3.3.1",
     "react-process-string": "^1.2.0",
     "react-tether": "^0.6.1",
-    "react-textarea-autosize": "^5.2.1",
+    "react-textarea-autosize": "^6.0.0",
     "react-virtualized": "^9.18.5",
     "regenerator-runtime": "^0.11.1",
     "sass-lint": "^1.12.1",
-    "sass-loader": "^6.0.6",
-    "style-loader": "^0.20.1",
-    "stylelint": "^8.4.0",
-    "stylelint-config-standard": "^18.0.0",
-    "stylelint-order": "^0.8.0",
-    "uglifyjs-webpack-plugin": "^1.1.8",
-    "webpack": "^3.10.0",
-    "webpack-bundle-analyzer": "^2.9.2",
-    "webpack-dev-server": "^2.11.1",
-    "worker-farm": "^1.5.2"
+    "sass-loader": "^6.0.7",
+    "style-loader": "^0.20.2",
+    "stylelint": "^9.1.1",
+    "stylelint-config-standard": "^18.2.0",
+    "stylelint-order": "^0.8.1",
+    "uglifyjs-webpack-plugin": "^1.2.2",
+    "webpack": "^4.1.1",
+    "webpack-bundle-analyzer": "^2.11.1",
+    "webpack-cli": "^2.0.10",
+    "webpack-dev-server": "^3.1.0",
+    "worker-farm": "^1.5.4"
   },
   "peerDependencies": {
     "axios": "^0.18.0",
-    "box-react-ui": "^22.4.5",
+    "box-react-ui": "^22.4.9",
     "classnames": "^2.2.5",
     "filesize": "^3.6.0",
     "jsuri": "^1.3.1",
-    "lodash": "^4.17.4",
+    "lodash": "^4.17.5",
+    "randomcolor": "^0.5.3",
     "react": "^15.6.0 || ^16.0.0",
     "react-dom": "^15.6.0 || ^16.0.0",
     "react-intl": "^2.3.0",
     "react-measure": "^2.0.2",
-    "react-modal": "^3.1.11",
+    "react-modal": "^3.3.1",
     "react-process-string": "^1.2.0",
     "react-tether": "^0.6.1",
-    "react-textarea-autosize": "^5.2.1",
+    "react-textarea-autosize": "^6.0.0",
     "react-virtualized": "^9.13.0",
     "regenerator-runtime": "^0.11.1"
   }