CONSOLE-3905: use esbuild-loader instead of ts-loader

Improves build speed by 50% (267s vs 142s)
openshift · Dec 5, 2024 · f84c21c · f84c21c
1 parent 3ef0438
commit f84c21c
Show file tree

Hide file tree

Showing 6 changed files with 194 additions and 35 deletions.
diff --git a/frontend/package.json b/frontend/package.json
@@ -284,6 +284,7 @@
     "cypress-jest-adapter": "^0.1.1",
     "cypress-multi-reporters": "^1.4.0",
     "enzyme": "3.10.x",
+    "esbuild-loader": "^4.2.2",
     "file-loader": "6.2.0",
     "find-up": "4.x",
     "fork-ts-checker-webpack-plugin": "9.0.2",
@@ -320,7 +321,6 @@
     "style-loader": "^2.0.0",
     "thread-loader": "^4.0.4",
     "ts-jest": "21.x",
-    "ts-loader": "^9.5.1",
     "ts-node": "10.9.2",
     "typescript": "4.5.5",
     "umd-compat-loader": "^2.1.2",

diff --git a/frontend/packages/dev-console/integration-tests/plugins/index.js b/frontend/packages/dev-console/integration-tests/plugins/index.js
@@ -24,10 +24,7 @@ module.exports = (on, config) => {
         rules: [
           {
             test: /\.tsx?$/,
-            loader: 'ts-loader',
-            options: {
-              transpileOnly: true,
-            },
+            loader: 'esbuild-loader',
           },
           {
             test: /\.feature$/,

diff --git a/frontend/packages/integration-tests-cypress/plugins/index.js b/frontend/packages/integration-tests-cypress/plugins/index.js
@@ -14,8 +14,7 @@ module.exports = (on, config) => {
         rules: [
           {
             test: /\.tsx?$/,
-            loader: 'ts-loader',
-            options: { happyPackMode: true, transpileOnly: true },
+            loader: 'esbuild-loader',
           },
         ],
       },

diff --git a/frontend/packages/topology/integration-tests/plugins/index.js b/frontend/packages/topology/integration-tests/plugins/index.js
@@ -22,10 +22,7 @@ module.exports = (on, config) => {
         rules: [
           {
             test: /\.tsx?$/,
-            loader: 'ts-loader',
-            options: {
-              transpileOnly: true,
-            },
+            loader: 'esbuild-loader',
           },
           {
             test: /\.feature$/,

diff --git a/frontend/webpack.config.ts b/frontend/webpack.config.ts
@@ -174,12 +174,10 @@ const config: Configuration = {
               ]
             : []),
           {
-            loader: 'ts-loader',
+            loader: 'esbuild-loader',
             options: {
               // Always use the root tsconfig.json. Packages might have a separate tsconfig.json for storybook.
-              configFile: path.resolve(__dirname, 'tsconfig.json'),
-              happyPackMode: true, // This implicitly enables transpileOnly! No type checking!
-              transpileOnly: true, // fork-ts-checker-webpack-plugin takes care of type checking
+              tsconfig: path.resolve(__dirname, 'tsconfig.json'),
             },
           },
         ],