fix(nf): #386 and #387

libs/mf-tools/package.json

@@ -2,10 +2,8 @@
   "name": "@angular-architects/module-federation-tools",
   "version": "17.0.0",
   "license": "MIT",
-  "peerDependencies": {
-  },
+  "peerDependencies": {},
   "dependencies": {
     "tslib": "^2.0.0"
   }
 }
-

libs/native-federation-core/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@softarc/native-federation",
-  "version": "2.0.4",
+  "version": "2.0.7",
   "type": "commonjs",
   "dependencies": {
     "json5": "^2.2.0",
     "npmlog": "^6.0.2",
-    "@softarc/native-federation-runtime": "2.0.4"
+    "@softarc/native-federation-runtime": "2.0.7"
   }
 }

libs/native-federation-core/src/lib/config/share-utils.ts

@@ -233,6 +233,12 @@ function readConfiguredSecondaries(
     }
 
     const entry = getDefaultEntry(exports, key);
+
+    if (typeof entry !== 'string') {
+      console.log('No entry point found for ' + secondaryName);
+      continue;
+    }
+
     if (
       entry?.endsWith('.css') ||
       entry?.endsWith('.scss') ||
@@ -259,6 +265,10 @@ function getDefaultEntry(
     entry = exports[key] as unknown as string;
   } else {
     entry = exports[key]?.['default'];
+
+    if (typeof entry === 'object') {
+      entry = entry['default'];
+    }
   }
   return entry;
 }

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

@@ -85,10 +85,29 @@ export async function bundleShared(
     if (e instanceof Error) {
       logger.error(e.message);
     }
+
     logger.error('For more information, run in verbose mode');
+
+    logger.notice('');
+    logger.notice('');
+
+    logger.notice('** Important Information: ***');
+    logger.notice(
+      'The error message above shows an issue with bundling a node_module.'
+    );
     logger.notice(
-      `If you don't need this package, skip it in your federation.config.js!`
+      'In most cases this is because you (indirectly) shared a Node.js package,'
     );
+    logger.notice('while Native Federation builds for the browser.');
+    logger.notice(
+      'You can move such packages into devDependencies or skip them in your federation.config.js.'
+    );
+    logger.notice('');
+    logger.notice('More Details: https://bit.ly/nf-issue');
+
+    logger.notice('');
+    logger.notice('');
+
     logger.verbose(e);
   }
 

libs/native-federation-core/src/lib/utils/package-info.ts

@@ -199,6 +199,8 @@ export function _getPackageInfo(
   if (typeof cand === 'object') {
     if (cand.module) {
       cand = cand.module;
+    } else if (cand.import) {
+      cand = cand.import;
     } else if (cand.default) {
       cand = cand.default;
     } else {
@@ -210,6 +212,8 @@ export function _getPackageInfo(
     if (typeof cand === 'object') {
       if (cand.module) {
         cand = cand.module;
+      } else if (cand.import) {
+        cand = cand.import;
       } else if (cand.default) {
         cand = cand.default;
       } else {
@@ -230,6 +234,8 @@ export function _getPackageInfo(
   if (typeof cand === 'object') {
     if (cand.module) {
       cand = cand.module;
+    } else if (cand.import) {
+      cand = cand.import;
     } else if (cand.default) {
       cand = cand.default;
     } else {
@@ -251,6 +257,8 @@ export function _getPackageInfo(
     if (typeof cand === 'object') {
       if (cand.module) {
         cand = cand.module;
+      } else if (cand.import) {
+        cand = cand.import;
       } else if (cand.default) {
         cand = cand.default;
       } else {

libs/native-federation-esbuild/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@softarc/native-federation-esbuild",
-  "version": "2.0.4",
+  "version": "2.0.7",
   "type": "commonjs",
   "dependencies": {
     "@rollup/plugin-commonjs": "^22.0.2",

libs/native-federation-runtime/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@softarc/native-federation-runtime",
-  "version": "2.0.4",
+  "version": "2.0.7",
   "peerDependencies": {},
   "dependencies": {
     "tslib": "^2.3.0"

libs/native-federation/README.md

@@ -23,7 +23,7 @@ We will at least provide a new version of this package per Angular major. If nec
 - Use version 16.1.x for Angular 16.1.x
 - Use version 16.2.x for Angular 16.2.x
 - Use version 17.x for Angular 17.x
-  
+
 ## Credits
 
 Big thanks to:

libs/native-federation/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@angular-architects/native-federation",
-  "version": "17.0.0",
+  "version": "17.0.6",
   "main": "src/index.js",
   "generators": "./collection.json",
   "builders": "./builders.json",
@@ -16,15 +16,14 @@
   },
   "dependencies": {
     "@babel/core": "^7.19.0",
-    "@softarc/native-federation": "2.0.4",
-    "@softarc/native-federation-runtime": "2.0.4",
+    "@softarc/native-federation": "2.0.7",
+    "@softarc/native-federation-runtime": "2.0.7",
     "@types/browser-sync": "^2.26.3",
     "browser-sync": "^2.29.3",
     "esbuild": "^0.19.5",
     "mrmime": "^1.0.1",
     "npmlog": "^6.0.2",
     "process": "0.11.10"
   },
-  "peerDependencies": {
-  }
+  "peerDependencies": {}
 }

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

@@ -32,7 +32,7 @@ import {
 } from '../../utils/dev-server';
 import { RebuildHubs } from '../../utils/rebuild-events';
 import { updateIndexHtml } from '../../utils/updateIndexHtml';
-import { existsSync, mkdirSync, rmdirSync } from 'fs';
+import { existsSync, mkdirSync, rmSync } from 'fs';
 import {
   EsBuildResult,
   MemResults,
@@ -80,7 +80,15 @@ export async function* runBuilder(
   const config = await loadFederationConfig(fedOptions);
   const externals = getExternals(config);
 
-  options.externalDependencies = externals.filter((e) => e !== 'tslib');
+  // options.externalDependencies = externals.filter((e) => e !== 'tslib');
+  const plugins = [
+    {
+      name: 'externals',
+      setup(build) {
+        build.initialOptions.external = externals.filter((e) => e !== 'tslib');
+      },
+    },
+  ];
 
   // for await (const r of buildEsbuildBrowser(options, context as any, { write: false })) {
   //   const output = r.outputFiles ||[];
@@ -103,23 +111,35 @@ export async function* runBuilder(
   let lastResult: { success: boolean } | undefined;
 
   if (existsSync(options.outputPath)) {
-    rmdirSync(options.outputPath, { recursive: true });
+    rmSync(options.outputPath, { recursive: true });
   }
 
   if (!existsSync(options.outputPath)) {
     mkdirSync(options.outputPath, { recursive: true });
   }
 
   if (!write) {
-    setMemResultHandler((outFiles) => {
-      memResults.add(outFiles.map((f) => new EsBuildResult(f)));
+    setMemResultHandler((outFiles, outDir) => {
+      const fullOutDir = outDir
+        ? path.join(fedOptions.workspaceRoot, outDir)
+        : null;
+      memResults.add(outFiles.map((f) => new EsBuildResult(f, fullOutDir)));
     });
   }
 
+  await buildForFederation(config, fedOptions, externals);
+
+  options.deleteOutputPath = false;
+
   // builderRun.output.subscribe(async (output) => {
-  for await (const output of buildEsbuildBrowser(options, context as any, {
-    write,
-  })) {
+  for await (const output of buildEsbuildBrowser(
+    options,
+    context as any,
+    {
+      write,
+    },
+    plugins
+  )) {
     lastResult = output;
 
     if (!output.success) {
@@ -144,10 +164,6 @@ export async function* runBuilder(
       updateIndexHtml(fedOptions);
     }
 
-    if (first) {
-      await buildForFederation(config, fedOptions, externals);
-    }
-
     if (first && runServer) {
       startServer(nfOptions, options.outputPath, memResults);
     }

libs/native-federation/src/utils/angular-esbuild-adapter.ts

@@ -42,7 +42,10 @@ import {
 
 // const fesmFolderRegExp = /[/\\]fesm\d+[/\\]/;
 
-export type MemResultHandler = (outfiles: esbuild.OutputFile[]) => void;
+export type MemResultHandler = (
+  outfiles: esbuild.OutputFile[],
+  outdir?: string
+) => void;
 
 let _memResultHandler: MemResultHandler;
 
@@ -238,6 +241,8 @@ async function runEsbuild(
     undefined
   );
 
+  pluginOptions.styleOptions.externalDependencies = [];
+
   const config: esbuild.BuildOptions = {
     entryPoints: entryPoints.map((ep) => ({
       in: ep.fileName,
@@ -259,6 +264,7 @@ async function runEsbuild(
     platform: 'browser',
     format: 'esm',
     target: ['esnext'],
+    logLimit: kind === 'shared-package' ? 1 : 0,
     plugins: plugins || [
       createCompilerPlugin(
         pluginOptions.pluginOptions,
@@ -326,7 +332,7 @@ function writeResult(
   const writtenFiles: string[] = [];
 
   if (memOnly) {
-    _memResultHandler(result.outputFiles);
+    _memResultHandler(result.outputFiles, outdir);
   }
 
   for (const outFile of result.outputFiles) {

libs/native-federation/src/utils/dev-server.ts

@@ -26,7 +26,10 @@ export function startServer(
     open: options.open,
     middleware: [
       function (req, res, next) {
-        const key = req.url.startsWith('/') ? req.url.substring(1) : req.url;
+        const temp = req.url.startsWith('/') ? req.url.substring(1) : req.url;
+        const key =
+          temp.indexOf('?') > -1 ? temp.substring(0, temp.indexOf('?')) : temp;
+
         const result = memResults.get(key);
 
         if (result) {

libs/native-federation/src/utils/mem-resuts.ts

@@ -1,6 +1,6 @@
 import { OutputFile } from 'esbuild';
-import { basename } from 'path';
 import * as fs from 'fs';
+import * as path from 'path';
 
 export interface BuildResult {
   fileName: string;
@@ -9,10 +9,14 @@ export interface BuildResult {
 
 export class EsBuildResult implements BuildResult {
   get fileName() {
-    return basename(this.outputFile.path);
+    if (this.fullOutDir) {
+      return unify(path.relative(this.fullOutDir, this.outputFile.path));
+    } else {
+      return unify(this.outputFile.path);
+    }
   }
 
-  constructor(private outputFile: OutputFile) {}
+  constructor(private outputFile: OutputFile, private fullOutDir?: string) {}
 
   get(): Uint8Array {
     return this.outputFile.contents;

update-local.bat

@@ -1,7 +1,7 @@
-call npm unpublish @softarc/native-federation@2.0.4 --registry http://localhost:4873
-call npm unpublish @softarc/native-federation-runtime@2.0.4 --registry http://localhost:4873
-call npm unpublish @softarc/native-federation-esbuild@2.0.4 --registry http://localhost:4873
-call npm unpublish @angular-architects/native-federation@16.3.4 --registry http://localhost:4873
+call npm unpublish @softarc/native-federation@2.0.5 --registry http://localhost:4873
+call npm unpublish @softarc/native-federation-runtime@2.0.5 --registry http://localhost:4873
+call npm unpublish @softarc/native-federation-esbuild@2.0.5 --registry http://localhost:4873
+call npm unpublish @angular-architects/native-federation@17.0.3 --registry http://localhost:4873
 
 call npx nx build native-federation
 call npx nx build native-federation-core