feat(nf): also enable baseHref for ng serve

Author: manfredsteyer

libs/native-federation-core/src/lib/core/bundle-shared.ts

@@ -39,7 +39,7 @@ export async function bundleShared(
     //   ? `${encName}-${encVersion}-dev.js`
     //   : `${encName}-${encVersion}.js`;
 
-    const hash = calcFileHash(pi);
+    const hash = calcHash(pi);
 
     const outName = fedOptions.dev
       ? `${encName}.${hash}-dev.js`
@@ -138,7 +138,7 @@ export async function bundleShared(
   });
 }
 
-function calcFileHash(pi: PackageInfo) {
+function calcHash(pi: PackageInfo) {
   const hashBase = pi.version + '_' + pi.entryPoint;
   const hash = crypto
     .createHash('sha256')

libs/native-federation/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@angular-architects/native-federation",
-  "version": "18.1.0",
+  "version": "18.1.2",
   "main": "src/index.js",
   "generators": "./collection.json",
   "builders": "./builders.json",

libs/native-federation/src/builders/build/builder.ts

@@ -127,7 +127,11 @@ export async function* runBuilder(
   const watch = !!runServer || nfOptions.watch;
 
   options.watch = watch;
-  options.baseHref = nfOptions.baseHref;
+
+  if (nfOptions.baseHref) {
+    options.baseHref = nfOptions.baseHref;
+  }
+
   const rebuildEvents = new RebuildHubs();
 
   const adapter = createAngularBuildAdapter(options, context, rebuildEvents);
@@ -180,18 +184,21 @@ export async function* runBuilder(
 
   const middleware = [
     (req, res, next) => {
+      const url = removeBaseHref(req, options.baseHref);
+
       const fileName = path.join(
         fedOptions.workspaceRoot,
         fedOptions.outputPath,
-        req.url
+        url
       );
+      
       const exists = fs.existsSync(fileName);
 
-      if (req.url !== '/' && req.url !== '' && exists) {
+      if (url !== '/' && url !== '' && exists) {
         const lookup = mrmime.lookup;
         const mimeType = lookup(path.extname(fileName)) || 'text/javascript';
         const rawBody = fs.readFileSync(fileName, 'utf-8');
-        const body = addDebugInformation(req.url, rawBody);
+        const body = addDebugInformation(url, rawBody);
         res.writeHead(200, {
           'Content-Type': mimeType,
           'Access-Control-Allow-Origin': '*',
@@ -316,6 +323,15 @@ export async function* runBuilder(
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export default createBuilder(runBuilder) as any;
 
+function removeBaseHref(req: any, baseHref?: string) {
+  let url = req.url;
+
+  if (baseHref && url.startsWith(baseHref)) {
+    url = url.substr(baseHref.length);
+  }
+  return url;
+}
+
 function infereConfigPath(tsConfig: string): string {
   const relProjectPath = path.dirname(tsConfig);
   const relConfigPath = path.join(relProjectPath, 'federation.config.js');

libs/native-federation/src/patch-angular-build.ts

@@ -1,4 +1,6 @@
-import { patchAngularBuild } from './utils/patch-angular-build';
+// import { patchAngularBuild } from './utils/patch-angular-build';
 
-const workspaceRoot = process.cwd();
-patchAngularBuild(workspaceRoot);
+// const workspaceRoot = process.cwd();
+// patchAngularBuild(workspaceRoot);
+
+console.log('Please remove the postbuild task calling patch-angular-build. This is not needed since Native Federation 18.1 anymore!');