Step 2 - Add support for custom index.html modification function

Author: klerick

libs/nx-angular-mf/src/builders/helpers/prepare-config.ts

@@ -7,6 +7,7 @@ import { BuildExecutorSchema } from '../build/schema';
 import { ConfigMf } from '../types';
 import { workspaceRootPath } from './utils';
 import { externalMap, getFullShare, getSharedMappings } from './dependencies';
+import { loadModule } from './load-module';
 
 export async function prepareConfig(
   defaultOptions: SchemaMf['mf'],
@@ -16,6 +17,7 @@ export async function prepareConfig(
   const skipList: ConfigMf['skipList'] = [];
   const externalList: ConfigMf['externalList'] = [];
   const esPlugins: ConfigMf['esPlugins'] = [];
+  let indexHtmlTransformer = (input: string) => Promise.resolve(input);
 
   if (defaultOptions.skipList) {
     skipList.push(...(await checkIsFileOrArray(defaultOptions.skipList)));
@@ -42,6 +44,14 @@ export async function prepareConfig(
     esPlugins.push(...tmpEsPlugins);
   }
 
+  if (defaultOptions.indexHtmlTransformer) {
+    indexHtmlTransformer = await loadModule(
+      join(workspaceRootPath, defaultOptions.indexHtmlTransformer),
+      join(workspaceRootPath, `${buildOptions['tsConfig']}`),
+      context.logger
+    );
+  }
+
   return {
     skipList: skipList,
     externalList: externalList,
@@ -52,6 +62,7 @@ export async function prepareConfig(
     outPutFileNames: [],
     esPlugins,
     allImportMap: {},
+    indexHtmlTransformer
   };
 }
 

libs/nx-angular-mf/src/builders/schema/index.ts

@@ -3,5 +3,6 @@ export type SchemaMf = {
     skipList?: string | string[];
     externalList?: string | string[];
     esPlugins?: string[];
+    indexHtmlTransformer?: string;
   };
 };

libs/nx-angular-mf/src/builders/schema/schema.json

@@ -41,6 +41,9 @@
           "items": {
             "type": "string"
           }
+        },
+        "indexHtmlTransformer": {
+          "type": "string"
         }
       },
       "additionalProperties": false

libs/nx-angular-mf/src/builders/serve/index.ts

@@ -98,7 +98,10 @@ export async function* runBuilder(
 
 
   const transforms = {
-    indexHtml: mainTransform,
+    indexHtml: async (input: string) => {
+      const mainTransformResult = await mainTransform(input);
+      return optionsMfe.indexHtmlTransformer(mainTransformResult);
+    },
   };
 
   const runServer = serveWithVite(

libs/nx-angular-mf/src/builders/types.ts

@@ -6,6 +6,7 @@ export type ConfigMf = {
   outPutFileNames: string[];
   esPlugins: string[];
   allImportMap: Record<string, unknown>;
+  indexHtmlTransformer: (input: string) => Promise<string>;
 };
 
 export type ShareOptions = {