Use REAL babel.config in electron-webpack

.babelrc

@@ -1,52 +1,3 @@
 {
-  "presets": [
+  "presets": ["./babel.config.js"]
-    [
-      "@babel/preset-env",
-      {
-        "loose": true,
-        "modules": false,
-        "targets": {
-          "electron": "1.8",
-          "node": "current"
-        }
-      }
-    ],
-    "@babel/preset-flow",
-    "@babel/preset-react",
-    "@babel/preset-stage-0"
-  ],
-  "plugins": [
-    ["babel-plugin-module-resolver", { "root": ["src"] }],
-    [
-      "babel-plugin-styled-components",
-      {
-        "displayName": false,
-        "minify": true,
-        "ssr": true
-      }
-    ]
-  ],
-  "env": {
-    "test": {
-      "presets": [
-        [
-          "@babel/preset-env",
-          {
-            "modules": "commonjs"
-          }
-        ]
-      ]
-    },
-    "development": {
-      "plugins": [
-        [
-          "babel-plugin-styled-components",
-          {
-            "displayName": true,
-            "minify": false
-          }
-        ]
-      ]
-    }
-  }
 }

babel.config.js

@@ -0,0 +1,32 @@
+const { NODE_ENV } = process.env
+
+const __TEST__ = NODE_ENV === 'test'
+
+module.exports = () => ({
+  presets: [
+    [
+      require('@babel/preset-env'),
+      {
+        loose: true,
+        modules: __TEST__ ? 'commonjs' : false,
+        targets: {
+          electron: '1.8',
+          node: 'current',
+        },
+      },
+    ],
+    require('@babel/preset-flow'),
+    require('@babel/preset-react'),
+    require('@babel/preset-stage-0'),
+  ],
+  plugins: [
+    [require('babel-plugin-module-resolver'), { root: ['src'] }],
+    [
+      require('babel-plugin-styled-components'),
+      {
+        displayName: NODE_ENV === 'development',
+        ssr: __TEST__,
+      },
+    ],
+  ],
+})

package.json

@@ -108,6 +108,7 @@
     "babel-core": "7.0.0-bridge.0",
     "babel-eslint": "^8.2.1",
     "babel-jest": "^22.4.3",
+    "babel-loader": "^8.0.0-beta.2",
     "babel-plugin-module-resolver": "^3.1.1",
     "babel-plugin-styled-components": "^1.5.0",
     "chalk": "^2.3.1",

scripts/dist.sh

@@ -1,5 +1,5 @@
 #/bin/bash
 
 rm -rf dist &&
-NODE_ENV=production webpack-cli --config webpack/internals.config.js &&
+NODE_ENV=production webpack-cli --mode production --config webpack/internals.config.js &&
-electron-webpack
+NODE_ENV=production electron-webpack

scripts/start.sh

@@ -1,5 +1,5 @@
 #/bin/bash
 
 concurrently --raw \
-  "cross-env NODE_ENV=development webpack-cli --watch --config webpack/internals.config.js" \
+  "cross-env NODE_ENV=development webpack-cli --mode development --watch --config webpack/internals.config.js" \
   "cross-env NODE_ENV=development electron-webpack dev"

webpack/internals.config.js

@@ -4,6 +4,7 @@ const webpackMain = require('electron-webpack/webpack.main.config')
 
 const plugins = require('./plugins')
 const resolve = require('./resolve')
+const rules = require('./rules')
 
 const dirs = p =>
   fs
@@ -40,7 +41,10 @@ module.exports = webpackMain().then(config => ({
     path: path.resolve(__dirname, '../dist/internals'),
   },
 
-  module: config.module,
+  module: {
+    ...config.module,
+    rules,
+  },
 
   plugins: [...plugins('internals'), ...config.plugins],
 }))

webpack/main.config.js

@@ -1,9 +1,14 @@
 const plugins = require('./plugins')
 const resolve = require('./resolve')
+const rules = require('./rules')
 
 const config = {
+  mode: __ENV__,
   plugins: plugins('main'),
   resolve,
+  module: {
+    rules,
+  },
 }
 
 module.exports = config

webpack/renderer.config.js

@@ -2,10 +2,15 @@ const HardSourceWebpackPlugin = require('hard-source-webpack-plugin')
 
 const plugins = require('./plugins')
 const resolve = require('./resolve')
+const rules = require('./rules')
 
 const config = {
+  mode: __ENV__,
   resolve,
   plugins: [...plugins('renderer'), new HardSourceWebpackPlugin()],
+  module: {
+    rules,
+  },
   devServer: {
     historyApiFallback: true,
   },

webpack/rules.js

@@ -0,0 +1,12 @@
+const babelConfig = require('../babel.config')
+
+module.exports = [
+  {
+    test: /\.js$/,
+    loader: 'babel-loader',
+    options: {
+      babelrc: false,
+      ...babelConfig(),
+    },
+  },
+]