examples: improve minimal example (#688)

* examples: remove node_modules from minimal server bundle * examples: simplify minimal example webpack build configuration
yahoo · May 12, 2021 · 881084c · 881084c
1 parent 479a9b1
commit 881084c
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 44 deletions.
diff --git a/examples/minimal/babel.config.js b/examples/minimal/babel.config.js
@@ -0,0 +1,14 @@
+const isNodeTarget = (api) =>
+  api.caller((caller) => caller && caller.target === "node");
+
+module.exports = (api) => ({
+  presets: [
+    [
+      "@babel/preset-env",
+      {
+        targets: isNodeTarget(api) ? { node: "current" } : "defaults",
+      },
+    ],
+    "@babel/preset-react",
+  ],
+});
diff --git a/examples/minimal/babel.config.json b/examples/minimal/babel.config.json
diff --git a/examples/minimal/package.json b/examples/minimal/package.json
@@ -5,12 +5,10 @@
   "author": "Pablo Palacios <pablo.palacios@holidaycheck.com>",
   "private": true,
   "scripts": {
-    "build": "npm run build:browser && npm run build:server",
-    "build:browser": "BABEL_ENV=browser webpack",
-    "build:server": "BABEL_ENV=server webpack",
+    "build": "NODE_ENV=production webpack",
     "dev": "npm run dev:browser & npm run dev:server",
-    "dev:browser": "NODE_ENV=development BABEL_ENV=browser webpack --watch",
-    "dev:server": "NODE_ENV=development BABEL_ENV=server webpack --watch & nodemon",
+    "dev:browser": "NODE_ENV=development webpack --watch --no-stats",
+    "dev:server": "NODE_ENV=development nodemon",
     "start": "node ."
   },
   "dependencies": {
@@ -28,6 +26,7 @@
     "babel-loader": "^8.2.2",
     "nodemon": "^2.0.7",
     "webpack": "^5.36.1",
-    "webpack-cli": "^4.6.0"
+    "webpack-cli": "^4.6.0",
+    "webpack-node-externals": "^3.0.0"
   }
 }
diff --git a/examples/minimal/webpack.config.js b/examples/minimal/webpack.config.js
@@ -1,21 +1,10 @@
 const path = require("path");
+const nodeExternals = require("webpack-node-externals");
 
-const isServer = process.env.BABEL_ENV === "server";
 const isProduction = process.env.NODE_ENV !== "development";
 
-module.exports = {
+const commonConfig = {
   mode: isProduction ? "production" : "development",
-  target: isServer ? "node" : "web",
-  entry: isServer ? "./src/server.js" : "./src/browser.js",
-  output: isServer
-    ? {
-        filename: "server.js",
-        path: path.resolve(__dirname, "dist"),
-      }
-    : {
-        filename: "browser.js",
-        path: path.resolve(__dirname, "dist/assets"),
-      },
   module: {
     rules: [
       {
@@ -26,3 +15,28 @@ module.exports = {
     ],
   },
 };
+
+const browserConfig = {
+  ...commonConfig,
+  target: "web",
+  entry: "./src/browser.js",
+  output: {
+    filename: "browser.js",
+    path: path.resolve(__dirname, "dist/assets"),
+    publicPath: "/assets/",
+  },
+};
+
+const serverConfig = {
+  ...commonConfig,
+  target: "node",
+  entry: "./src/server.js",
+  output: {
+    filename: "server.js",
+    path: path.resolve(__dirname, "dist"),
+  },
+  externals: [nodeExternals()],
+  externalsPresets: { node: true },
+};
+
+module.exports = [browserConfig, serverConfig];