do not include wasm in the default bundle js

because it increses the size of bundle +5KiB (+base64-js dep)

Author: gfx

karma.conf.ts

@@ -1,6 +1,7 @@
 import { sauceLabs, sauceLaunchers } from "./sauceLabs";
 
 const webpackConfig = require("./webpack.config.js");
+const webpack = require("webpack");
 
 export default function configure(config: any) {
   config.set({
@@ -61,12 +62,16 @@ export default function configure(config: any) {
           },
         ],
       },
+      plugins: [
+        new webpack.DefinePlugin({
+          "process.env.MSGPACK_WASM": JSON.stringify(process.env.MSGPACK_WASM),
+        }),
+      ],
       optimization: {
         minimize: false,
       },
       performance: {
-        maxEntrypointSize: 50 * 1024 ** 2,
-        maxAssetSize: 50 * 1024 ** 2,
+        hints: false,
       },
       devtool: "inline-source-map",
     },

package.json

@@ -67,6 +67,7 @@
     "karma-sauce-launcher": "^2.0.2",
     "karma-sourcemap-loader": "^0.3.7",
     "karma-webpack": "^3.0.5",
+    "lodash": "^4.17.11",
     "mocha": "^6.1.4",
     "msgpack-lite": "^0.1.26",
     "msgpack-test-js": "^1.0.0",

tools/pack-wasm.ts

@@ -27,7 +27,7 @@ var wasmInstance = new WebAssembly.Instance(wasmModule, {
   env: {
     abort: function (filename, line, column) {
       // FIXME: filename is just a number (pointer?)
-      throw new Error(\`abort called at \${filename}:\${line}:\${column}\`);
+      throw new Error("abort called at " + filename + ":" + line + ":" + column);
     },
   },
 });

tsconfig.dist.webpack.json

@@ -6,8 +6,7 @@
     "outDir": "./build/es5",
     "declaration": false,
     "downlevelIteration": true,
-    "noEmitOnError": true,
-    "incremental": false,
+    "noEmitOnError": true
   },
   "include": ["src/**/*.ts"]
 }

webpack.config.js

@@ -1,14 +1,16 @@
 "use strict";
 
 const path = require("path");
+const webpack = require("webpack");
 const { CheckEsVersionPlugin } = require("@bitjourney/check-es-version-webpack-plugin");
-module.exports = {
+const _ = require("lodash");
+
+const config = {
   mode: "production",
 
   entry: "./src/index.ts",
   output: {
     path: path.resolve(__dirname, "dist.es5"),
-    filename: "msgpack.js",
     libraryTarget: "commonjs",
   },
   resolve: {
@@ -26,7 +28,17 @@ module.exports = {
     ],
   },
 
-  // We use webpack just to reduce filesystem accesses
+  plugins: [
+    new CheckEsVersionPlugin({
+      esVersion: 5, // for IE11 support
+    }),
+  ],
+  externals: {
+    "base64-js": {
+      commonjs: "base64-js",
+    },
+  },
+
   optimization: {
     noEmitOnErrors: true,
     minimize: false,
@@ -36,11 +48,34 @@ module.exports = {
   // https://webpack.js.org/configuration/node/
   node: false,
 
-  plugins: [
-    new CheckEsVersionPlugin({
-      esVersion: 5, // for IE11 support
-    }),
-  ],
-
   devtool: "source-map",
 };
+
+module.exports = [
+  // default bundle does not includes wasm
+  ((config) => {
+    config.output.filename = "msgpack.js";
+    config.plugins.push(
+      new webpack.DefinePlugin({
+        // The default bundle does not includes WASM
+        "process.env.MSGPACK_WASM": JSON.stringify("never"),
+        "process.env.WASM": JSON.stringify(null),
+      }),
+      new webpack.IgnorePlugin(/\.\/dist\/wasm\/msgpack\.wasm\.js$/),
+    );
+    return config;
+  })(_.cloneDeep(config)),
+
+  // +wsm
+  ((config) => {
+    config.output.filename = "msgpack+wasm.js";
+    config.plugins.push(
+      new webpack.DefinePlugin({
+        // The default bundle does not includes WASM
+        "process.env.MSGPACK_WASM": JSON.stringify(null),
+        "process.env.WASM": JSON.stringify(null),
+      }),
+    );
+    return config;
+  })(_.cloneDeep(config)),
+];