diff --git a/libs/native-federation-core/src/lib/core/build-for-federation.ts b/libs/native-federation-core/src/lib/core/build-for-federation.ts index eaf3c327..28d4fff3 100644 --- a/libs/native-federation-core/src/lib/core/build-for-federation.ts +++ b/libs/native-federation-core/src/lib/core/build-for-federation.ts @@ -53,7 +53,7 @@ export async function buildForFederation( }; writeFederationInfo(federationInfo, fedOptions); - writeImportMap(sharedInfo, fedOptions); + writeImportMap(federationInfo, fedOptions); return federationInfo; } diff --git a/libs/native-federation-core/src/lib/core/write-import-map.ts b/libs/native-federation-core/src/lib/core/write-import-map.ts index 5fa39f11..a9b853e7 100644 --- a/libs/native-federation-core/src/lib/core/write-import-map.ts +++ b/libs/native-federation-core/src/lib/core/write-import-map.ts @@ -1,20 +1,27 @@ import * as path from 'path'; import * as fs from 'fs'; -import { SharedInfo } from '@softarc/native-federation-runtime'; +import { FederationInfo } from '@softarc/native-federation-runtime'; import { FederationOptions } from './federation-options'; export function writeImportMap( - sharedInfo: SharedInfo[], + { name, shared, exposes }: FederationInfo, fedOption: FederationOptions ) { - const imports = sharedInfo.reduce((acc, cur) => { + const sharedImports = shared.reduce((acc, cur) => { return { ...acc, - [cur.packageName]: cur.outFileName, + [cur.packageName]: `./${cur.outFileName}`, }; }, {}); - const importMap = { imports }; + const exposesImports = exposes.reduce((acc, cur) => { + return { + ...acc, + [`${name}/${cur.key}`]: `./${cur.outFileName}`, + }; + }, {}); + + const importMap = { imports: { ...sharedImports, ...exposesImports } }; const importMapPath = path.join( fedOption.workspaceRoot, fedOption.outputPath, diff --git a/libs/native-federation/src/builders/build/builder.ts b/libs/native-federation/src/builders/build/builder.ts index cb1d83ef..838ff4c6 100644 --- a/libs/native-federation/src/builders/build/builder.ts +++ b/libs/native-federation/src/builders/build/builder.ts @@ -52,6 +52,7 @@ import { createSharedMappingsPlugin } from '../../utils/shared-mappings-plugin'; import { Connect } from 'vite'; import { PluginBuild } from 'esbuild'; import { FederationInfo } from '@softarc/native-federation-runtime'; +import { ImportMap } from '@softarc/native-federation-runtime/lib/model/import-map'; export async function* runBuilder( nfOptions: NfBuilderSchema, @@ -311,10 +312,16 @@ function transformIndexHtml( } function addDebugInformation(fileName: string, rawBody: string): string { - if (fileName !== '/remoteEntry.json') { - return rawBody; + if (fileName === '/remoteEntry.json') { + return addRemoteEntryDebugInformation(rawBody); + } + if (fileName === '/importmap.json') { + return addImportMapDebugInformation(rawBody); } + return rawBody; +} +function addRemoteEntryDebugInformation(rawBody: string): string { const remoteEntry = JSON.parse(rawBody) as FederationInfo; const shared = remoteEntry.shared; @@ -331,3 +338,24 @@ function addDebugInformation(fileName: string, rawBody: string): string { return JSON.stringify(remoteEntry, null, 2); } + +function addImportMapDebugInformation(rawBody: string): string { + const importMap = JSON.parse(rawBody) as ImportMap; + const imports = importMap.imports; + + if (!imports) { + return rawBody; + } + + const importsForVite = Object.entries(imports).reduce( + (acc, [packageName, bundle]) => ({ + ...acc, + [`/@id/${packageName}`]: bundle, + }), + {} + ); + + importMap.imports = { ...imports, ...importsForVite }; + + return JSON.stringify(importMap, null, 2); +}