Merge remote-tracking branch 'upstream/master'

Author: gurkodil

packages/playground/index.js

@@ -6,8 +6,6 @@ import { Widget as IdWidget } from '@ncwidgets/id'
 import { Widget as FileRelationWidget } from '@ncwidgets/file-relation'
 import { createWidget as createReorderWidget } from '@ncwidgets/reorder'
 
-const h = React.createElement.bind(React)
-
 const loadData = async (dataPath) => {
   const data = await fetch(dataPath)
     .then(data => data.json())
@@ -40,7 +38,7 @@ const CMS = () => {
     cms.init()
   })
 
-  return h('div', { id: 'nc-root' })
+  return <div id="nc-root"></div>
 }
 
-render(h(CMS), createRoot())
+render(<CMS />, createRoot())

packages/playground/package.json

@@ -16,5 +16,11 @@
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "author": "",
-  "license": "ISC"
+  "license": "ISC",
+  "devDependencies": {
+    "@babel/core": "^7.5.5",
+    "@babel/preset-env": "^7.5.5",
+    "@babel/preset-react": "^7.0.0",
+    "babel-loader": "^8.0.6"
+  }
 }

packages/playground/webpack.config.js

@@ -12,6 +12,24 @@ module.exports = {
     filename: 'bundle.js',
   },
   devtool: 'eval-source-map',
+  module: {
+    rules: [
+      {
+        test: /\.m?js$/,
+        exclude: /node_modules/,
+        use: {
+          loader: 'babel-loader',
+          options: {
+            sourceType: 'module',
+            presets: [
+              ['@babel/preset-env', { targets: { esmodules: true }}], 
+              '@babel/preset-react'
+            ],
+          }
+        }
+      }
+    ],
+  },
   plugins: [
     new HtmlPlugin(),
     new CopyPlugin([{