chore(deps): upgrade to babel 7

react-grid-layout · Oct 9, 2019 · 0ec7f53 · 0ec7f53
1 parent 0cb8e3e
commit 0ec7f53
Show file tree

Hide file tree

Showing 10 changed files with 3,647 additions and 4,382 deletions.
diff --git a/.babelrc b/.babelrc
diff --git a/.babelrc.js b/.babelrc.js
@@ -0,0 +1,25 @@
+'use strict';
+
+module.exports = {
+  "presets": [
+    [
+      "@babel/preset-env",
+      {
+        targets: "> 0.25%, not dead"
+      }
+    ],
+    "@babel/react",
+    "@babel/preset-flow"
+  ],
+  "plugins": [
+    "@babel/plugin-transform-flow-comments",
+    "@babel/plugin-proposal-class-properties",
+  ],
+  "env": {
+    "test": {
+      "plugins": [
+        "espower"
+      ]
+    }
+  }
+}
diff --git a/Makefile b/Makefile
@@ -44,7 +44,6 @@ view-example: build-example
 lint:
 	@$(BIN)/flow
 	@$(BIN)/eslint --ext .js,.jsx $(LIB) $(TEST)
-	@$(BIN)/valiquire $(LIB)
 
 test:
 	@$(BIN)/jest

diff --git a/package.json b/package.json
@@ -38,47 +38,43 @@
   "dependencies": {
     "classnames": "2.x",
     "lodash.isequal": "^4.0.0",
-    "prop-types": "15.x",
-    "react-draggable": "3.x",
-    "react-resizable": "1.x"
+    "prop-types": "^15.0.0",
+    "react-draggable": "^4.0.0",
+    "react-resizable": "^1.0.0"
   },
   "devDependencies": {
-    "babel-cli": "^6.24.1",
-    "babel-core": "^6.24.1",
-    "babel-eslint": "^8.2.1",
-    "babel-jest": "^22.2.2",
-    "babel-loader": "^7.1.2",
-    "babel-plugin-react-transform": "^3.0.0",
-    "babel-plugin-transform-react-constant-elements": "^6.5.0",
-    "babel-plugin-transform-react-inline-elements": "^6.6.5",
-    "babel-plugin-typecheck": "^3.6.1",
-    "babel-preset-env": "^1.7.0",
-    "babel-preset-react": "^6.24.1",
-    "babel-preset-stage-1": "^6.24.1",
-    "css-loader": "^0.28.9",
-    "ejs": "^2.4.1",
-    "eslint": "^4.17.0",
+    "@babel/core": "^7.6.0",
+    "@babel/plugin-proposal-class-properties": "^7.5.5",
+    "@babel/plugin-transform-flow-comments": "^7.6.0",
+    "@babel/preset-env": "^7.6.0",
+    "@babel/preset-flow": "^7.0.0",
+    "@babel/preset-react": "^7.0.0",
+    "babel-eslint": "^10.0.3",
+    "babel-jest": "^24.9.0",
+    "babel-loader": "^8.0.6",
+    "css-loader": "^3.2.0",
+    "ejs": "^2.7.1",
+    "eslint": "^6.4.0",
     "eslint-plugin-flowtype": "^4.3.0",
-    "eslint-plugin-mocha": "^4.11.0",
-    "eslint-plugin-react": "^7.6.1",
+    "eslint-plugin-mocha": "^6.1.1",
+    "eslint-plugin-react": "^7.14.3",
     "exports-loader": "^0.7.0",
     "flow-bin": "^0.107.0",
     "husky": "^3.0.8",
-    "imports-loader": "^0.7.1",
-    "jest-cli": "^22.3.0",
-    "lint-staged": "^6.1.0",
+    "imports-loader": "^0.8.0",
+    "jest-cli": "^24.9.0",
+    "lint-staged": "^9.2.5",
     "lodash": "^4.17.5",
     "opener": "^1.4.3",
-    "prettier": "^1.10.2",
-    "react": "^16.2.0",
-    "react-dom": "^16.2.0",
-    "react-hot-loader": "^3.1.3",
+    "prettier": "^1.18.2",
+    "react": "^16.9.0",
+    "react-dom": "^16.9.0",
+    "react-hot-loader": "^4.12.13",
     "react-transform-hmr": "^1.0.2",
-    "style-loader": "^0.20.2",
-    "valiquire": "^0.3.0",
-    "webpack": "^4.0.0",
-    "webpack-cli": "^3.2.1",
-    "webpack-dev-server": "^3.1.11"
+    "style-loader": "^1.0.0",
+    "webpack": "^4.40.2",
+    "webpack-cli": "^3.3.9",
+    "webpack-dev-server": "^3.8.1"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org"

diff --git a/test/dev-hook.jsx b/test/dev-hook.jsx
@@ -1,2 +1,8 @@
-var DevLayout = require("./examples/0-showcase.jsx");
-require("./test-hook.jsx")(DevLayout);
+import 'react-hot-loader';
+import { hot } from 'react-hot-loader/root';
+const DevLayout = require('./examples/0-showcase.jsx');
+const makeLayout = require('./test-hook');
+
+const Layout = makeLayout(DevLayout);
+
+export default hot(Layout);
diff --git a/test/test-hook.jsx b/test/test-hook.jsx
@@ -40,4 +40,6 @@ module.exports = function(Layout) {
     const gridProps = window.gridProps || {};
     ReactDOM.render(React.createElement(ExampleLayout, gridProps), contentDiv);
   });
+
+  return ExampleLayout;
 };
diff --git a/webpack-dev-server.config.js b/webpack-dev-server.config.js
@@ -1,5 +1,6 @@
+"use strict";
 const path = require("path");
-var webpack = require("webpack");
+const webpack = require("webpack");
 
 module.exports = {
   mode: "development",
@@ -19,18 +20,7 @@ module.exports = {
         query: {
           cacheDirectory: true,
           plugins: [
-            [
-              "react-transform",
-              {
-                transforms: [
-                  {
-                    transform: "react-transform-hmr",
-                    imports: ["react"],
-                    locals: ["module"]
-                  }
-                ]
-              }
-            ]
+            ['react-hot-loader/babel']
           ]
         }
       }

diff --git a/webpack-examples.config.js b/webpack-examples.config.js
@@ -1,6 +1,6 @@
-"use strict";
-var webpack = require("webpack");
-var fs = require("fs");
+'use strict';
+const webpack = require('webpack');
+const fs = require('fs');
 
 // Builds example bundles
 module.exports = {
@@ -21,24 +21,15 @@ module.exports = {
     }
   },
   output: {
-    path: __dirname + "/dist",
-    filename: "[name].bundle.js",
-    sourceMapFilename: "[file].map"
+      path: __dirname + "/dist",
+      filename: "[name].js",
+      sourceMapFilename: "[file].map",
   },
   module: {
     rules: [
-      {
-        test: /\.jsx?$/,
-        exclude: /node_modules/,
-        loader: "babel-loader",
-        query: {
-          cacheDirectory: true,
-          plugins: [
-            "transform-react-inline-elements",
-            "transform-react-constant-elements"
-          ]
-        }
-      }
+      {test: /\.jsx?$/, exclude: /node_modules/, loader: 'babel-loader', query: {
+        cacheDirectory: true,
+      }}
     ]
   },
   plugins: [
@@ -55,14 +46,11 @@ module.exports = {
 };
 
 // Load all entry points
-var files = fs
-  .readdirSync(__dirname + "/test/examples")
-  .filter(function(element, index, array) {
-    return element.match(/^.+\.jsx$/);
-  });
+const files = fs.readdirSync(__dirname + '/test/examples').filter(function(element, index, array){
+  return element.match(/^.+\.jsx$/);
+});
 
-for (var idx in files) {
-  var file = files[idx];
-  var module_name = file.replace(/\.jsx$/, "");
-  module.exports.entry[module_name] = "./test/examples/" + file;
+for (const file of files){
+  const module_name = file.replace(/\.jsx$/,'');
+  module.exports.entry[module_name] = './test/examples/' + file;
 }
diff --git a/webpack.config.js b/webpack.config.js
@@ -26,16 +26,22 @@ module.exports = {
       root: "React"
     },
     "react-dom": {
-      commonjs: "react-dom",
-      commonjs2: "react-dom",
-      amd: "react-dom",
-      // React dep should be available as window.React, not window.react
-      root: "ReactDOM"
+      "commonjs": "react-dom",
+      "commonjs2": "react-dom",
+      "amd": "react-dom",
+      "root": "ReactDOM"
     }
   },
   module: {
     rules: [
-      { test: /\.jsx?$/, exclude: /node_modules/, loader: "babel-loader" }
+      {
+        test: /\.jsx?$/, 
+        exclude: /node_modules/, 
+        loader: "babel-loader",
+        query: {
+          cacheDirectory: true,
+        }
+      }
     ]
   },
   plugins: [