From 7b170dc852e2bf5149f5a224221f267d0ddac9ec Mon Sep 17 00:00:00 2001
From: matthewkeil <me@matthewkeil.com>
Date: Mon, 10 Jun 2024 19:48:09 +0200
Subject: [PATCH] feat: add null-loader to simpleserialze webpack config

---
 packages/simpleserialize.com/package.json     |  1 +
 .../simpleserialize.com/webpack.config.js     | 86 ++++++++++---------
 yarn.lock                                     |  8 ++
 3 files changed, 56 insertions(+), 39 deletions(-)

diff --git a/packages/simpleserialize.com/package.json b/packages/simpleserialize.com/package.json
index e472df4b..ab66ad7c 100644
--- a/packages/simpleserialize.com/package.json
+++ b/packages/simpleserialize.com/package.json
@@ -25,6 +25,7 @@
     "eyzy-tree": "^0.2.2",
     "file-saver": "^2.0.5",
     "js-yaml": "^4.1.0",
+    "null-loader": "^4.0.1",
     "react": "^17.0.2",
     "react-alert": "^7.0.1",
     "react-alert-template-basic": "^1.0.0",
diff --git a/packages/simpleserialize.com/webpack.config.js b/packages/simpleserialize.com/webpack.config.js
index 0f2ae396..f822c0b7 100644
--- a/packages/simpleserialize.com/webpack.config.js
+++ b/packages/simpleserialize.com/webpack.config.js
@@ -1,22 +1,22 @@
-const webpack = require('webpack');
-const { resolve } = require('path');
-const MiniCssExtractPlugin = require('mini-css-extract-plugin')
-const HtmlWebpackPlugin = require('html-webpack-plugin');
+const webpack = require("webpack");
+const {resolve} = require("path");
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+const HtmlWebpackPlugin = require("html-webpack-plugin");
 
-const isProd = process.env.NODE_ENV === 'production';
+const isProd = process.env.NODE_ENV === "production";
 
 const config = {
   devtool: "source-map",
-  mode: isProd ? 'production' : 'development',
+  mode: isProd ? "production" : "development",
   entry: {
-    index: './src/index.tsx',
+    index: "./src/index.tsx",
   },
   output: {
-    path: resolve(__dirname, 'dist'),
-    filename: '[name].js',
+    path: resolve(__dirname, "dist"),
+    filename: "[name].js",
   },
   resolve: {
-    extensions: ['.js', '.jsx', '.ts', '.tsx'],
+    extensions: [".js", ".jsx", ".ts", ".tsx"],
   },
   module: {
     rules: [
@@ -27,45 +27,49 @@ const config = {
         },
       },
       {
-      test: /\.scss$/,
-      use: [
+        test: /\.scss$/,
+        use: [
           MiniCssExtractPlugin.loader,
           {
-            loader: 'css-loader'
+            loader: "css-loader",
           },
           {
-            loader: 'sass-loader',
+            loader: "sass-loader",
             options: {
               sourceMap: true,
-            }
-          }
-        ]
-      },{
+            },
+          },
+        ],
+      },
+      {
         test: /\.tsx?$/,
-        use: 'babel-loader',
+        use: "babel-loader",
         exclude: /node_modules/,
-      }
+      },
+      {
+        use: "null-loader",
+        test: /@chainsafe\/hashtree/,
+      },
     ],
   },
   plugins: [
     new webpack.ProvidePlugin({
-      process: 'process/browser',
-      Buffer: ['buffer', 'Buffer'],
+      process: "process/browser",
+      Buffer: ["buffer", "Buffer"],
     }),
     new MiniCssExtractPlugin({
-      filename: 'css/[name].bundle.css'
+      filename: "css/[name].bundle.css",
     }),
     new HtmlWebpackPlugin({
-      title: 'Simple Serialize | Chainsafe Systems',
-      template: 'src/index.html',
+      title: "Simple Serialize | Chainsafe Systems",
+      template: "src/index.html",
     }),
   ],
 };
 
 if (isProd) {
   config.optimization = {
-    minimizer: [
-    ],
+    minimizer: [],
   };
 } else {
   config.devServer = {
@@ -73,7 +77,7 @@ if (isProd) {
     open: true, // https://webpack.js.org/configuration/dev-server/#devserveropen
     hot: true, // https://webpack.js.org/configuration/dev-server/#devserverhot
     compress: true, // https://webpack.js.org/configuration/dev-server/#devservercompress
-    stats: 'errors-only', // https://webpack.js.org/configuration/dev-server/#devserverstats-
+    stats: "errors-only", // https://webpack.js.org/configuration/dev-server/#devserverstats-
     overlay: true, // https://webpack.js.org/configuration/dev-server/#devserveroverlay
   };
 }
@@ -81,14 +85,14 @@ if (isProd) {
 const workerConfig = {
   name: "worker",
   resolve: {
-    extensions: ['.js', '.jsx', '.ts', '.tsx'],
+    extensions: [".js", ".jsx", ".ts", ".tsx"],
   },
   entry: {
-    index: './src/components/worker/index.ts',
+    index: "./src/components/worker/index.ts",
   },
   output: {
-    path: resolve(__dirname, 'dist'),
-    filename: 'worker.js',
+    path: resolve(__dirname, "dist"),
+    filename: "worker.js",
   },
   module: {
     rules: [
@@ -100,21 +104,25 @@ const workerConfig = {
       },
       {
         test: /worker?$/,
-        loader: 'threads-webpack-plugin',
+        loader: "threads-webpack-plugin",
       },
       {
         test: /\.ts?$/,
-        use: 'babel-loader',
+        use: "babel-loader",
         exclude: /node_modules/,
-      }
+      },
+      {
+        use: "null-loader",
+        test: /@chainsafe\/hashtree/,
+      },
     ],
   },
   plugins: [
     new webpack.ProvidePlugin({
-      process: 'process/browser',
-      Buffer: ['buffer', 'Buffer'],
+      process: "process/browser",
+      Buffer: ["buffer", "Buffer"],
     }),
-  ]
-}
+  ],
+};
 
 module.exports = [config, workerConfig];
diff --git a/yarn.lock b/yarn.lock
index 66d1b7ec..75b41a42 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8980,6 +8980,14 @@ nth-check@^2.0.1:
   dependencies:
     boolbase "^1.0.0"
 
+null-loader@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/null-loader/-/null-loader-4.0.1.tgz#8e63bd3a2dd3c64236a4679428632edd0a6dbc6a"
+  integrity sha512-pxqVbi4U6N26lq+LmgIbB5XATP0VdZKOG25DhHi8btMmJJefGArFyDg1yc4U3hWCJbMqSrw0qyrz1UQX+qYXqg==
+  dependencies:
+    loader-utils "^2.0.0"
+    schema-utils "^3.0.0"
+
 nx@19.0.4, "nx@>=17.1.2 < 20":
   version "19.0.4"
   resolved "https://registry.yarnpkg.com/nx/-/nx-19.0.4.tgz#c39803f6186f6b009c39f5f30f902ce8e136dcde"