diff --git a/packages/angular/src/generators/remote/remote.spec.ts b/packages/angular/src/generators/remote/remote.spec.ts index 6d66de8dd5aa2..5a073f79e0f9e 100644 --- a/packages/angular/src/generators/remote/remote.spec.ts +++ b/packages/angular/src/generators/remote/remote.spec.ts @@ -455,7 +455,7 @@ describe('MF Remote App Generator', () => { [Error: Invalid remote name: my-remote. Remote project names must: - Start with a letter, dollar sign ($) or underscore (_) - Followed by any valid character (letters, digits, underscores, or dollar signs) - The regular expression used is /^[a-zA-Z_$][a-zA-Z_$0-9]*$/.] + The regular expression used is ^[a-zA-Z_$][a-zA-Z_$0-9]*$.] `); }); }); diff --git a/packages/rspack/src/utils/module-federation/remotes.ts b/packages/rspack/src/utils/module-federation/remotes.ts index 8c000da93f0be..9add3862405c9 100644 --- a/packages/rspack/src/utils/module-federation/remotes.ts +++ b/packages/rspack/src/utils/module-federation/remotes.ts @@ -16,12 +16,19 @@ export function mapRemotes( ): Record { const mappedRemotes = {}; - for (const remote of remotes) { - if (Array.isArray(remote)) { - const remoteName = normalizeRemoteName(remote[0]); - mappedRemotes[remoteName] = handleArrayRemote(remote, remoteEntryExt); - } else if (typeof remote === 'string') { - mappedRemotes[remote] = handleStringRemote(remote, determineRemoteUrl); + for (const nxRemoteProjectName of remotes) { + if (Array.isArray(nxRemoteProjectName)) { + const mfRemoteName = normalizeRemoteName(nxRemoteProjectName[0]); + mappedRemotes[mfRemoteName] = handleArrayRemote( + nxRemoteProjectName, + remoteEntryExt + ); + } else if (typeof nxRemoteProjectName === 'string') { + const mfRemoteName = normalizeRemoteName(nxRemoteProjectName[0]); + mappedRemotes[mfRemoteName] = handleStringRemote( + nxRemoteProjectName, + determineRemoteUrl + ); } } @@ -33,8 +40,8 @@ function handleArrayRemote( remote: [string, string], remoteEntryExt: 'js' | 'mjs' ): string { - let [remoteName, remoteLocation] = remote; - remoteName = normalizeRemoteName(remoteName); + let [nxRemoteProjectName, remoteLocation] = remote; + const mfRemoteName = normalizeRemoteName(nxRemoteProjectName); const remoteLocationExt = extname(remoteLocation); // If remote location already has .js or .mjs extension @@ -46,7 +53,7 @@ function handleArrayRemote( ? remoteLocation.slice(0, -1) : remoteLocation; - const globalPrefix = `${remoteName.replace(/-/g, '_')}@`; + const globalPrefix = `${normalizeRemoteName(mfRemoteName)}@`; // if the remote is defined with anything other than http then we assume it's a promise based remote // In that case we should use what the user provides as the remote location @@ -59,12 +66,12 @@ function handleArrayRemote( // Helper function to deal with remotes that are strings function handleStringRemote( - remote: string, - determineRemoteUrl: (remote: string) => string + nxRemoteProjectName: string, + determineRemoteUrl: (nxRemoteProjectName: string) => string ): string { - const globalPrefix = `${remote.replace(/-/g, '_')}@`; + const globalPrefix = `${normalizeRemoteName(nxRemoteProjectName)}@`; - return `${globalPrefix}${determineRemoteUrl(remote)}`; + return `${globalPrefix}${determineRemoteUrl(nxRemoteProjectName)}`; } /** @@ -84,10 +91,10 @@ export function mapRemotesForSSR( for (const remote of remotes) { if (Array.isArray(remote)) { - let [remoteName, remoteLocation] = remote; - remoteName = normalizeRemoteName(remoteName); + let [nxRemoteProjectName, remoteLocation] = remote; + const mfRemoteName = normalizeRemoteName(nxRemoteProjectName); const remoteLocationExt = extname(remoteLocation); - mappedRemotes[remoteName] = `${remoteName}@${ + mappedRemotes[mfRemoteName] = `${mfRemoteName}@${ ['.js', '.mjs'].includes(remoteLocationExt) ? remoteLocation : `${ @@ -97,14 +104,16 @@ export function mapRemotesForSSR( }/remoteEntry.${remoteEntryExt}` }`; } else if (typeof remote === 'string') { - const remoteName = normalizeRemoteName(remote); - mappedRemotes[remoteName] = `${remoteName}@${determineRemoteUrl(remote)}`; + const mfRemoteName = normalizeRemoteName(remote); + mappedRemotes[mfRemoteName] = `${mfRemoteName}@${determineRemoteUrl( + remote + )}`; } } return mappedRemotes; } -function normalizeRemoteName(remote: string): string { - return remote.replace(/-/g, '_'); +function normalizeRemoteName(nxRemoteProjectName: string): string { + return nxRemoteProjectName.replace(/-/g, '_'); } diff --git a/packages/webpack/src/utils/module-federation/remotes.ts b/packages/webpack/src/utils/module-federation/remotes.ts index 1651d37cd1245..daa462244df1a 100644 --- a/packages/webpack/src/utils/module-federation/remotes.ts +++ b/packages/webpack/src/utils/module-federation/remotes.ts @@ -17,18 +17,18 @@ export function mapRemotes( ): Record { const mappedRemotes = {}; - for (const remote of remotes) { - if (Array.isArray(remote)) { - const remoteName = normalizeRemoteName(remote[0]); - mappedRemotes[remoteName] = handleArrayRemote( - remote, + for (const nxRemoteProjectName of remotes) { + if (Array.isArray(nxRemoteProjectName)) { + const mfRemoteName = normalizeRemoteName(nxRemoteProjectName[0]); + mappedRemotes[mfRemoteName] = handleArrayRemote( + nxRemoteProjectName, remoteEntryExt, isRemoteGlobal ); - } else if (typeof remote === 'string') { - const remoteName = normalizeRemoteName(remote); - mappedRemotes[remoteName] = handleStringRemote( - remoteName, + } else if (typeof nxRemoteProjectName === 'string') { + const mfRemoteName = normalizeRemoteName(nxRemoteProjectName); + mappedRemotes[mfRemoteName] = handleStringRemote( + nxRemoteProjectName, determineRemoteUrl, isRemoteGlobal ); @@ -44,8 +44,8 @@ function handleArrayRemote( remoteEntryExt: 'js' | 'mjs', isRemoteGlobal: boolean ): string { - let [remoteName, remoteLocation] = remote; - remoteName = normalizeRemoteName(remoteName); + let [nxRemoteProjectName, remoteLocation] = remote; + const mfRemoteName = normalizeRemoteName(nxRemoteProjectName); const remoteLocationExt = extname(remoteLocation); // If remote location already has .js or .mjs extension @@ -58,7 +58,7 @@ function handleArrayRemote( : remoteLocation; const globalPrefix = isRemoteGlobal - ? `${remoteName.replace(/-/g, '_')}@` + ? `${normalizeRemoteName(nxRemoteProjectName)}@` : ''; // if the remote is defined with anything other than http then we assume it's a promise based remote @@ -72,13 +72,15 @@ function handleArrayRemote( // Helper function to deal with remotes that are strings function handleStringRemote( - remote: string, - determineRemoteUrl: (remote: string) => string, + nxRemoteProjectName: string, + determineRemoteUrl: (nxRemoteProjectName: string) => string, isRemoteGlobal: boolean ): string { - const globalPrefix = isRemoteGlobal ? `${remote.replace(/-/g, '_')}@` : ''; + const globalPrefix = isRemoteGlobal + ? `${normalizeRemoteName(nxRemoteProjectName)}@` + : ''; - return `${globalPrefix}${determineRemoteUrl(remote)}`; + return `${globalPrefix}${determineRemoteUrl(nxRemoteProjectName)}`; } /** @@ -98,10 +100,10 @@ export function mapRemotesForSSR( for (const remote of remotes) { if (Array.isArray(remote)) { - let [remoteName, remoteLocation] = remote; - remoteName = normalizeRemoteName(remoteName); + let [nxRemoteProjectName, remoteLocation] = remote; + const mfRemoteName = normalizeRemoteName(nxRemoteProjectName); const remoteLocationExt = extname(remoteLocation); - mappedRemotes[remoteName] = `${remoteName}@${ + mappedRemotes[mfRemoteName] = `${mfRemoteName}@${ ['.js', '.mjs'].includes(remoteLocationExt) ? remoteLocation : `${ @@ -111,8 +113,10 @@ export function mapRemotesForSSR( }/remoteEntry.${remoteEntryExt}` }`; } else if (typeof remote === 'string') { - const remoteName = normalizeRemoteName(remote); - mappedRemotes[remoteName] = `${remoteName}@${determineRemoteUrl(remote)}`; + const mfRemoteName = normalizeRemoteName(remote); + mappedRemotes[mfRemoteName] = `${mfRemoteName}@${determineRemoteUrl( + remote + )}`; } }