for #950, update babel to v7 (#1077)

* for #950, upgrade babel to v7

* fix linting errors

* for #950, remove @babel/core from devDependencies (so it's only in dependencies) and change babel-loader config to use .babelrc

* for #950, changes to .babelrc to make  work

* for #950, include core-js modules in webpack config for IE support with babel/plugin-syntax-dynamic-import

* for #950, update babel and associated packages to LTS

Author: catarak

.babelrc

@@ -1,13 +1,83 @@
 {
-  "presets": ["react", "env", "stage-0"],
+  "presets": [
+    "@babel/preset-react",
+    "@babel/preset-env"
+  ],
   "env": {
     "production": {
       "plugins": [
         "transform-react-remove-prop-types",
-        "transform-react-constant-elements",
-        "transform-react-inline-elements"
+        "@babel/plugin-transform-react-constant-elements",
+        "@babel/plugin-transform-react-inline-elements",
+        "@babel/plugin-syntax-dynamic-import",
+        "@babel/plugin-syntax-import-meta",
+        [
+          "@babel/plugin-proposal-decorators",
+          {
+            "legacy": true
+          }
+        ],
+        [
+          "@babel/plugin-proposal-class-properties",
+          {
+            "loose": true
+          }
+        ],
+        "@babel/plugin-proposal-json-strings",
+        "@babel/plugin-proposal-function-sent",
+        "@babel/plugin-proposal-export-namespace-from",
+        "@babel/plugin-proposal-numeric-separator",
+        "@babel/plugin-proposal-throw-expressions",
+        "@babel/plugin-proposal-export-default-from",
+        "@babel/plugin-proposal-logical-assignment-operators",
+        "@babel/plugin-proposal-optional-chaining",
+        [
+          "@babel/plugin-proposal-pipeline-operator",
+          {
+            "proposal": "minimal"
+          }
+        ],
+        "@babel/plugin-proposal-nullish-coalescing-operator",
+        "@babel/plugin-proposal-do-expressions",
+        "@babel/plugin-proposal-function-bind"
       ],
-      "presets": ["env", "react", "react-optimize", "stage-0"]
+      "presets": [
+        "@babel/preset-env",
+        "@babel/preset-react"
+      ]
     }
-  }
-}
+  },
+  "plugins": [
+    "@babel/plugin-syntax-dynamic-import",
+    "@babel/plugin-syntax-import-meta",
+    [
+      "@babel/plugin-proposal-decorators",
+      {
+        "legacy": true
+      }
+    ],
+    [
+      "@babel/plugin-proposal-class-properties",
+      {
+        "loose": true
+      }
+    ],
+    "@babel/plugin-proposal-json-strings",
+    "@babel/plugin-proposal-function-sent",
+    "@babel/plugin-proposal-export-namespace-from",
+    "@babel/plugin-proposal-numeric-separator",
+    "@babel/plugin-proposal-throw-expressions",
+    "@babel/plugin-proposal-export-default-from",
+    "@babel/plugin-proposal-logical-assignment-operators",
+    "@babel/plugin-proposal-optional-chaining",
+    [
+      "@babel/plugin-proposal-pipeline-operator",
+      {
+        "proposal": "minimal"
+      }
+    ],
+    "@babel/plugin-proposal-nullish-coalescing-operator",
+    "@babel/plugin-proposal-do-expressions",
+    "@babel/plugin-proposal-function-bind"
+  ]
+}

client/modules/IDE/components/Editor.jsx

@@ -283,8 +283,6 @@ class Editor extends React.Component {
     }
   }
 
-  _cm: CodeMirror.Editor
-
   render() {
     const editorSectionClass = classNames({
       'editor': true,

client/modules/IDE/components/ErrorModal.jsx

@@ -26,7 +26,8 @@ class ErrorModal extends React.Component {
   staleProject() {
     return (
       <p>
-        The project you have attempted to save has been saved from another window. Please refresh the page to see the latest version.
+        The project you have attempted to save has been saved from another window.
+        Please refresh the page to see the latest version.
       </p>
     );
   }

client/modules/IDE/components/SketchList.jsx

@@ -36,7 +36,9 @@ class SketchList extends React.Component {
   }
 
   renderEmptyTable() {
-    if (!this.props.loading && this.props.sketches.length === 0) return (<p className="sketches-table__empty">No sketches.</p>);
+    if (!this.props.loading && this.props.sketches.length === 0) {
+      return (<p className="sketches-table__empty">No sketches.</p>);
+    }
     return null;
   }
 

client/modules/IDE/reducers/project.js

@@ -50,7 +50,7 @@ const project = (state, action) => {
       return Object.assign({}, state, { updatedAt: action.value });
     case ActionTypes.START_SAVING_PROJECT:
       return Object.assign({}, state, { isSaving: true });
-    case ActionTypes.START_STOP_PROJECT:
+    case ActionTypes.END_SAVING_PROJECT:
       return Object.assign({}, state, { isSaving: false });
     default:
       return state;

index.js

@@ -4,18 +4,10 @@ if (process.env.NODE_ENV === 'production') {
   require('./dist/server.bundle.js');
 } else {
   let parsed = require('dotenv').config();
-  require('babel-register')({
-    "plugins": [
-      [
-        "babel-plugin-webpack-loaders",
-        {
-          "config": "./webpack/config.babel.js",
-          "verbose": false
-        }
-      ]
-    ]
+  require('@babel/register')({
+    presets: ["@babel/preset-env"]
   });
-  require('babel-polyfill');
+  require('@babel/polyfill');
   //// in development, let .env values override those in the environment already (i.e. in docker-compose.yml)
   // so commenting this out makes the docker container work.
   // if (process.env.NODE_ENV === 'development') {