Refactor: speed up build

Author: akitaSummer

packages/hedgehog-lab/config-overrides.js

@@ -4,24 +4,44 @@ const {
   getBabelLoader,
   addWebpackPlugin,
   addWebpackModuleRule,
-} = require('customize-cra');
-const ReactRefreshPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
+} = require("customize-cra");
+const ReactRefreshPlugin = require("@pmmmwh/react-refresh-webpack-plugin");
+const { ESBuildPlugin } = require("esbuild-loader");
 
 module.exports = (config, env) => {
-  const prod = config.mode === 'production';
+  const prod = config.mode === "production";
   const babelLoader = getBabelLoader(config);
 
   return override(
+    addWebpackModuleRule({
+      test: /.tsx?$/,
+      use: [
+        {
+          loader: "esbuild-loader",
+          options: { loader: "tsx", target: "es2015" },
+        },
+      ],
+    }),
+
+    addWebpackModuleRule({
+      test: /.jsx?$/,
+      use: [
+        {
+          loader: "esbuild-loader",
+          options: { loader: "jsx", target: "es2015" },
+        },
+      ],
+    }),
     // You can choose to just use worker-loader! instead if you want
     addWebpackModuleRule({
       test: /\.worker\.[jt]sx?$/,
       use: [
-        { loader: 'worker-loader' },
+        { loader: "worker-loader" },
         { loader: babelLoader.loader, options: babelLoader.options },
       ],
     }),
-
-    !prod && addBabelPlugin('react-refresh/babel'),
+    addWebpackPlugin(new ESBuildPlugin()),
+    !prod && addBabelPlugin("react-refresh/babel"),
     !prod && addWebpackPlugin(new ReactRefreshPlugin())
   )(config, env);
 };

packages/hedgehog-lab/package.json

@@ -12,6 +12,7 @@
     "clsx": "^1.1.1",
     "codemirror": "^5.58.3",
     "comlink": "^4.3.0",
+    "esbuild-loader": "^2.9.1",
     "ky": "^0.23.0",
     "monaco-editor": "^0.20.0",
     "plotly.js": "^1.54.6",