From 40849a5942e94f61a9e4a0be4da6fe7a42439d07 Mon Sep 17 00:00:00 2001 From: Jonathan Gelin Date: Mon, 11 Mar 2024 12:04:39 +0100 Subject: [PATCH] feat(nf): Add `esmsInitOptions` to Angular builder to inject additional `sms-module-shims` options into `index.html` --- .../src/builders/build/builder.ts | 13 ++++++--- .../src/builders/build/schema.d.ts | 2 ++ .../src/builders/build/schema.json | 7 +++++ .../native-federation/src/utils/dev-server.ts | 15 +++++++---- .../src/utils/updateIndexHtml.ts | 27 +++++++++++++------ 5 files changed, 47 insertions(+), 17 deletions(-) diff --git a/libs/native-federation/src/builders/build/builder.ts b/libs/native-federation/src/builders/build/builder.ts index d851bf5c..d3a024e4 100644 --- a/libs/native-federation/src/builders/build/builder.ts +++ b/libs/native-federation/src/builders/build/builder.ts @@ -207,7 +207,7 @@ export async function* runBuilder( nfOptions.skipHtmlTransform ? {} : { - indexHtml: transformIndexHtml, + indexHtml: transformIndexHtml(nfOptions), }, { buildPlugins: plugins, @@ -239,7 +239,7 @@ export async function* runBuilder( } if (write && !nfOptions.dev && !nfOptions.skipHtmlTransform) { - updateIndexHtml(fedOptions); + updateIndexHtml(fedOptions, nfOptions); } if (first && runServer) { @@ -283,8 +283,13 @@ function infereConfigPath(tsConfig: string): string { return relConfigPath; } -function transformIndexHtml(content: string): Promise { - return Promise.resolve(updateScriptTags(content, 'main.js', 'polyfills.js')); +function transformIndexHtml( + nfOptions: NfBuilderSchema +): (content: string) => Promise { + return (content: string): Promise => + Promise.resolve( + updateScriptTags(content, 'main.js', 'polyfills.js', nfOptions) + ); } function addDebugInformation(fileName: string, rawBody: string): string { diff --git a/libs/native-federation/src/builders/build/schema.d.ts b/libs/native-federation/src/builders/build/schema.d.ts index fcda5dd6..1980f786 100644 --- a/libs/native-federation/src/builders/build/schema.d.ts +++ b/libs/native-federation/src/builders/build/schema.d.ts @@ -1,4 +1,5 @@ import { JsonObject } from '@angular-devkit/core'; +import type { ESMSInitOptions } from 'es-module-shims'; export interface NfBuilderSchema extends JsonObject { target: string; @@ -9,4 +10,5 @@ export interface NfBuilderSchema extends JsonObject { shell: string; watch: boolean; skipHtmlTransform: boolean; + esmsInitOptions: ESMSInitOptions; } // eslint-disable-line diff --git a/libs/native-federation/src/builders/build/schema.json b/libs/native-federation/src/builders/build/schema.json index 7fb73e73..aaaff754 100644 --- a/libs/native-federation/src/builders/build/schema.json +++ b/libs/native-federation/src/builders/build/schema.json @@ -42,6 +42,13 @@ "skipHtmlTransform": { "type": "boolean", "default": false + }, + "esmsInitOptions": { + "type": "object", + "description": "Options for esms-module-shims https://github.com/guybedford/es-module-shims?tab=readme-ov-file#init-options", + "default": { + "shimMode": true + } } } } diff --git a/libs/native-federation/src/utils/dev-server.ts b/libs/native-federation/src/utils/dev-server.ts index 5ded42f8..1f8cfce4 100644 --- a/libs/native-federation/src/utils/dev-server.ts +++ b/libs/native-federation/src/utils/dev-server.ts @@ -34,7 +34,7 @@ export function startServer( if (result) { const mimeType = lookup(extname(key)) || 'text/javascript'; - const body = getBody(result, memResults); + const body = getBody(result, memResults, options); res.writeHead(200, { 'Content-Type': mimeType, }); @@ -77,7 +77,11 @@ export function reloadShell(shellProjectName: string): void { } } -function modifyIndexHtml(content: string, fileNames: string[]): string { +function modifyIndexHtml( + content: string, + fileNames: string[], + nfOptions: NfBuilderSchema +): string { if (buildError) { const errorHtml = `
@@ -94,18 +98,19 @@ function modifyIndexHtml(content: string, fileNames: string[]): string { (f) => f.startsWith('polyfills.') && f.endsWith('.js') ); - const index = updateScriptTags(content, mainName, polyfillsName); + const index = updateScriptTags(content, mainName, polyfillsName, nfOptions); return index; } function getBody( result: BuildResult, - memResults: MemResults + memResults: MemResults, + nfOptions: NfBuilderSchema ): Uint8Array | Buffer | string { const body = result.get(); if (result.fileName === 'index.html') { const content = new TextDecoder().decode(body); - return modifyIndexHtml(content, memResults.getFileNames()); + return modifyIndexHtml(content, memResults.getFileNames(), nfOptions); } else { return body; } diff --git a/libs/native-federation/src/utils/updateIndexHtml.ts b/libs/native-federation/src/utils/updateIndexHtml.ts index 76e9fb95..78754a93 100644 --- a/libs/native-federation/src/utils/updateIndexHtml.ts +++ b/libs/native-federation/src/utils/updateIndexHtml.ts @@ -1,8 +1,12 @@ import * as path from 'path'; import * as fs from 'fs'; import { FederationOptions } from '@softarc/native-federation/build'; +import { NfBuilderSchema } from '../builders/build/schema'; -export function updateIndexHtml(fedOptions: FederationOptions) { +export function updateIndexHtml( + fedOptions: FederationOptions, + nfOptions: NfBuilderSchema +) { const outputPath = path.join(fedOptions.workspaceRoot, fedOptions.outputPath); const indexPath = path.join(outputPath, 'index.html'); const mainName = fs @@ -14,21 +18,28 @@ export function updateIndexHtml(fedOptions: FederationOptions) { let indexContent = fs.readFileSync(indexPath, 'utf-8'); - indexContent = updateScriptTags(indexContent, mainName, polyfillsName); + indexContent = updateScriptTags( + indexContent, + mainName, + polyfillsName, + nfOptions + ); fs.writeFileSync(indexPath, indexContent, 'utf-8'); } export function updateScriptTags( indexContent: string, mainName: string, - polyfillsName: string + polyfillsName: string, + nfOptions: NfBuilderSchema ) { + const esmsOptions = { + shimMode: true, + ...nfOptions.esmsInitOptions, + }; + const htmlFragment = ` - +