modularize microfrontend customization

jhipster · Mar 10, 2023 · 4b42504 · 4b42504
1 parent 794fc5e
commit 4b42504
Show file tree

Hide file tree

Showing 5 changed files with 54 additions and 28 deletions.
diff --git a/generators/angular/generator.mts b/generators/angular/generator.mts
@@ -150,6 +150,23 @@ export default class AngularGenerator extends BaseApplicationGenerator<Generator
     });
   }
 
+  get postWriting() {
+    return this.asPostWritingTaskGroup({
+      microfrontend({ application }) {
+        if (!application.microfrontend) return;
+        const conditional = application.applicationTypeMicroservice ? "targetOptions.target === 'serve' ? {} : " : '';
+        this.addWebpackConfig(
+          `${conditional}require('./webpack.microfrontend')(config, options, targetOptions)`,
+          application.clientFramework
+        );
+      },
+    });
+  }
+
+  get [BaseApplicationGenerator.POST_WRITING]() {
+    return this.asPostWritingTaskGroup(this.delegateTasksToBlueprint(() => this.postWriting));
+  }
+
   get [BaseApplicationGenerator.WRITING_ENTITIES]() {
     return this.delegateTasksToBlueprint(() => this.writingEntities);
   }

diff --git a/generators/client/generator.mjs b/generators/client/generator.mjs
@@ -199,40 +199,26 @@ export default class JHipsterClientGenerator extends BaseApplicationGenerator {
   get postWriting() {
     return this.asPostWritingTaskGroup({
       packageJsonScripts({ application }) {
-        const packageJsonStorage = this.createStorage('package.json');
-        const scriptsStorage = packageJsonStorage.createStorage('scripts');
+        const defaultEnvironment = process.env.JHI_PROFILE?.includes('dev') ? 'dev' : 'prod';
 
-        const packageJsonConfigStorage = packageJsonStorage.createStorage('config').createProxy();
-        if (process.env.JHI_PROFILE) {
-          packageJsonConfigStorage.default_environment = process.env.JHI_PROFILE.includes('dev') ? 'dev' : 'prod';
-        }
-
-        const devDependencies = packageJsonStorage.createStorage('devDependencies');
-        devDependencies.set('wait-on', application.nodeDependencies['wait-on']);
-        devDependencies.set('concurrently', application.nodeDependencies.concurrently);
+        this.packageJson.merge({
+          config: {
+            default_environment: defaultEnvironment,
+          },
+          devDependencies: {
+            'wait-on': application.nodeDependencies['wait-on'],
+            concurrently: application.nodeDependencies.concurrently,
+          },
+        });
 
+        const scriptsStorage = this.packageJson.createStorage('scripts');
         if (application.clientFrameworkReact) {
           scriptsStorage.set('ci:frontend:test', 'npm run webapp:build:$npm_package_config_default_environment && npm run test-ci');
         } else {
           scriptsStorage.set('ci:frontend:build', 'npm run webapp:build:$npm_package_config_default_environment');
           scriptsStorage.set('ci:frontend:test', 'npm run ci:frontend:build && npm test');
         }
       },
-
-      microfrontend({ application }) {
-        if (!application.microfrontend) return;
-        if (application.clientFrameworkAngular) {
-          const conditional = application.applicationTypeMicroservice ? "targetOptions.target === 'serve' ? {} : " : '';
-          this.addWebpackConfig(
-            `${conditional}require('./webpack.microfrontend')(config, options, targetOptions)`,
-            application.clientFramework
-          );
-        } else if (application.clientFrameworkVue || application.clientFrameworkReact) {
-          this.addWebpackConfig("require('./webpack.microfrontend')({ serve: options.env.WEBPACK_SERVE })", application.clientFramework);
-        } else {
-          throw new Error(`Client framework ${application.clientFramework} doesn't support microfrontends`);
-        }
-      },
     });
   }
 

diff --git a/generators/client/templates/webpack/webpack.microfrontend.js.jhi.ejs b/generators/client/templates/webpack/webpack.microfrontend.js.jhi.ejs
@@ -48,8 +48,5 @@ module.exports = ({ serve }) => {
       }),
 <&- fragments.pluginsSection() &>
     ],
-    output: {
-      publicPath: 'auto',
-    },
   };
 };
diff --git a/generators/react/generator.mjs b/generators/react/generator.mjs
@@ -135,6 +135,19 @@ export default class ReactGenerator extends BaseApplicationGenerator {
     return this.delegateTasksToBlueprint(() => this.writingEntities);
   }
 
+  get postWriting() {
+    return this.asPostWritingTaskGroup({
+      microfrontend({ application }) {
+        if (!application.microfrontend) return;
+        this.addWebpackConfig("require('./webpack.microfrontend')({ serve: options.env.WEBPACK_SERVE })", application.clientFramework);
+      },
+    });
+  }
+
+  get [BaseApplicationGenerator.POST_WRITING]() {
+    return this.asPostWritingTaskGroup(this.delegateTasksToBlueprint(() => this.postWriting));
+  }
+
   get postWritingEntities() {
     return {
       postWriteEntitiesFiles,

diff --git a/generators/vue/generator.mjs b/generators/vue/generator.mjs
@@ -125,6 +125,19 @@ export default class VueGenerator extends BaseApplicationGenerator {
     return this.delegateTasksToBlueprint(() => this.writingEntities);
   }
 
+  get postWriting() {
+    return this.asPostWritingTaskGroup({
+      microfrontend({ application }) {
+        if (!application.microfrontend) return;
+        this.addWebpackConfig("require('./webpack.microfrontend')(options)", application.clientFramework);
+      },
+    });
+  }
+
+  get [BaseApplicationGenerator.POST_WRITING]() {
+    return this.asPostWritingTaskGroup(this.delegateTasksToBlueprint(() => this.postWriting));
+  }
+
   get postWritingEntities() {
     return {
       postWriteEntityFiles,