angular: migrate to esbuild

jhipster · Nov 26, 2024 · ad6c59c · ad6c59c
1 parent d9f8533
commit ad6c59c
Show file tree

Hide file tree

Showing 16 changed files with 426 additions and 20 deletions.
diff --git a/generators/angular/__snapshots__/generator.spec.ts.snap b/generators/angular/__snapshots__/generator.spec.ts.snap
@@ -700,6 +700,23 @@ exports[`generator - angular gateway-jwt-skipUserManagement(true)-withAdminUi(fa
       "source": "TaskParameter[source]",
     },
   ],
+  "mergeClientPackageJson": [
+    {
+      "devDependencies": {
+        "@angular-builders/custom-webpack": null,
+        "browser-sync-webpack-plugin": null,
+        "copy-webpack-plugin": null,
+        "eslint-webpack-plugin": null,
+        "webpack-bundle-analyzer": null,
+        "webpack-merge": null,
+        "webpack-notifier": null,
+      },
+      "overrides": {
+        "browser-sync": "BROWSER_SYNC_VERSION",
+        "webpack": "WEBPACK_VERSION",
+      },
+    },
+  ],
 }
 `;
 
@@ -1626,6 +1643,25 @@ exports[`generator - angular gateway-oauth2-withAdminUi(true)-skipJhipsterDepend
       "source": "TaskParameter[source]",
     },
   ],
+  "mergeClientPackageJson": [
+    {
+      "devDependencies": {
+        "@angular-builders/custom-webpack": null,
+        "browser-sync-webpack-plugin": null,
+        "copy-webpack-plugin": null,
+        "eslint-webpack-plugin": null,
+        "folder-hash": null,
+        "merge-jsons-webpack-plugin": null,
+        "webpack-bundle-analyzer": null,
+        "webpack-merge": null,
+        "webpack-notifier": null,
+      },
+      "overrides": {
+        "browser-sync": "BROWSER_SYNC_VERSION",
+        "webpack": "WEBPACK_VERSION",
+      },
+    },
+  ],
 }
 `;
 
@@ -2313,6 +2349,23 @@ exports[`generator - angular microservice-jwt-skipUserManagement(false)-withAdmi
       "config": "targetOptions.target === 'serve' ? {} : require('./webpack.microfrontend')(config, options, targetOptions)",
     },
   ],
+  "mergeClientPackageJson": [
+    {
+      "devDependencies": {
+        "@angular-builders/custom-webpack": null,
+        "browser-sync-webpack-plugin": null,
+        "copy-webpack-plugin": null,
+        "eslint-webpack-plugin": null,
+        "webpack-bundle-analyzer": null,
+        "webpack-merge": null,
+        "webpack-notifier": null,
+      },
+      "overrides": {
+        "browser-sync": "BROWSER_SYNC_VERSION",
+        "webpack": "WEBPACK_VERSION",
+      },
+    },
+  ],
 }
 `;
 
@@ -3006,6 +3059,25 @@ exports[`generator - angular microservice-oauth2-withAdminUi(true)-skipJhipsterD
       "config": "targetOptions.target === 'serve' ? {} : require('./webpack.microfrontend')(config, options, targetOptions)",
     },
   ],
+  "mergeClientPackageJson": [
+    {
+      "devDependencies": {
+        "@angular-builders/custom-webpack": null,
+        "browser-sync-webpack-plugin": null,
+        "copy-webpack-plugin": null,
+        "eslint-webpack-plugin": null,
+        "folder-hash": null,
+        "merge-jsons-webpack-plugin": null,
+        "webpack-bundle-analyzer": null,
+        "webpack-merge": null,
+        "webpack-notifier": null,
+      },
+      "overrides": {
+        "browser-sync": "BROWSER_SYNC_VERSION",
+        "webpack": "WEBPACK_VERSION",
+      },
+    },
+  ],
 }
 `;
 
@@ -4100,6 +4172,25 @@ exports[`generator - angular monolith-jwt-skipUserManagement(false)-withAdminUi(
       "source": "TaskParameter[source]",
     },
   ],
+  "mergeClientPackageJson": [
+    {
+      "devDependencies": {
+        "@angular-builders/custom-webpack": null,
+        "browser-sync-webpack-plugin": null,
+        "copy-webpack-plugin": null,
+        "eslint-webpack-plugin": null,
+        "folder-hash": null,
+        "merge-jsons-webpack-plugin": null,
+        "webpack-bundle-analyzer": null,
+        "webpack-merge": null,
+        "webpack-notifier": null,
+      },
+      "overrides": {
+        "browser-sync": "BROWSER_SYNC_VERSION",
+        "webpack": "WEBPACK_VERSION",
+      },
+    },
+  ],
 }
 `;
 
@@ -4773,6 +4864,23 @@ exports[`generator - angular monolith-oauth2-withAdminUi(false)-skipJhipsterDepe
       "source": "TaskParameter[source]",
     },
   ],
+  "mergeClientPackageJson": [
+    {
+      "devDependencies": {
+        "@angular-builders/custom-webpack": null,
+        "browser-sync-webpack-plugin": null,
+        "copy-webpack-plugin": null,
+        "eslint-webpack-plugin": null,
+        "webpack-bundle-analyzer": null,
+        "webpack-merge": null,
+        "webpack-notifier": null,
+      },
+      "overrides": {
+        "browser-sync": "BROWSER_SYNC_VERSION",
+        "webpack": "WEBPACK_VERSION",
+      },
+    },
+  ],
 }
 `;
 
@@ -5455,6 +5563,23 @@ exports[`generator - angular monolith-session-skipUserManagement(true)-withAdmin
       "source": "TaskParameter[source]",
     },
   ],
+  "mergeClientPackageJson": [
+    {
+      "devDependencies": {
+        "@angular-builders/custom-webpack": null,
+        "browser-sync-webpack-plugin": null,
+        "copy-webpack-plugin": null,
+        "eslint-webpack-plugin": null,
+        "webpack-bundle-analyzer": null,
+        "webpack-merge": null,
+        "webpack-notifier": null,
+      },
+      "overrides": {
+        "browser-sync": "BROWSER_SYNC_VERSION",
+        "webpack": "WEBPACK_VERSION",
+      },
+    },
+  ],
 }
 `;
 

diff --git a/generators/angular/files-angular.ts b/generators/angular/files-angular.ts
@@ -28,21 +28,41 @@ export const files = {
   common: [
     clientRootTemplatesBlock({
       templates: [
-        'angular.json',
         { sourceFile: 'eslint.config.js.jhi.angular', destinationFile: ctx => `${ctx.eslintConfigFile}.jhi.angular` },
         'ngsw-config.json',
         'package.json',
         'tsconfig.json',
         'tsconfig.app.json',
         'tsconfig.spec.json',
         'jest.conf.js',
+      ],
+    }),
+  ],
+  webpack: [
+    clientRootTemplatesBlock({
+      condition: ctx => ctx.clientBundlerWebpack,
+      templates: [
+        'angular.json',
         'webpack/environment.js',
         'webpack/proxy.conf.js',
         'webpack/webpack.custom.js',
         'webpack/logo-jhipster.png',
       ],
     }),
   ],
+  esbuild: [
+    clientRootTemplatesBlock({
+      condition: ctx => ctx.clientBundlerExperimentalEsbuild,
+      templates: [
+        { sourceFile: 'angular.json.esbuild', destinationFile: 'angular.json' },
+        'proxy.conf.json',
+        'build-plugins/esbuild-copy.mjs',
+        'build-plugins/esbuild-define.mjs',
+        'build-plugins/swagger-ui.mjs',
+        'build-plugins/vite-middleware.mjs',
+      ],
+    }),
+  ],
   sass: [
     {
       ...clientSrcTemplatesBlock(),
@@ -67,7 +87,7 @@ export const files = {
   ],
   microfrontend: [
     clientRootTemplatesBlock({
-      condition: generator => generator.microfrontend,
+      condition: generator => generator.clientBundlerWebpack && generator.microfrontend,
       templates: ['webpack/webpack.microfrontend.js'],
     }),
     {

diff --git a/generators/angular/generator.ts b/generators/angular/generator.ts
@@ -266,6 +266,32 @@ export default class AngularGenerator extends BaseApplicationGenerator {
 
   get postWriting() {
     return this.asPostWritingTaskGroup({
+      clientBundler({ application, source }) {
+        if (application.clientBundlerExperimentalEsbuild) {
+          source.mergeClientPackageJson!({
+            devDependencies: {
+              '@angular-builders/custom-esbuild': null,
+            },
+          });
+        } else {
+          source.mergeClientPackageJson!({
+            devDependencies: {
+              '@angular-builders/custom-webpack': null,
+              'browser-sync-webpack-plugin': null,
+              'copy-webpack-plugin': null,
+              'eslint-webpack-plugin': null,
+              'webpack-bundle-analyzer': null,
+              'webpack-merge': null,
+              'webpack-notifier': null,
+              ...(application.enableTranslation ? { 'folder-hash': null, 'merge-jsons-webpack-plugin': null } : {}),
+            },
+            overrides: {
+              'browser-sync': application.nodeDependencies['browser-sync'],
+              webpack: application.nodeDependencies.webpack,
+            },
+          });
+        }
+      },
       addWebsocketDependencies({ application, source }) {
         const { authenticationTypeSession, communicationSpringWebsocket, nodeDependencies } = application;
         const dependencies = {};

diff --git a/generators/angular/resources/package.json b/generators/angular/resources/package.json
@@ -21,6 +21,7 @@
   "devDependencies": {
     "@angular-architects/module-federation": "18.0.6",
     "@angular-architects/module-federation-runtime": "18.0.6",
+    "@angular-builders/custom-esbuild": "18.0.0",
     "@angular-builders/custom-webpack": "18.0.0",
     "@angular-builders/jest": "18.0.0",
     "@angular/cli": "18.2.12",