fix: angular.json can contain comments

Author: manfredsteyer

libs/native-federation-core/src/lib/core/default-skip-list.ts

@@ -20,6 +20,7 @@ export const DEFAULT_SKIP_LIST: SkipList = [
   '@angular/ssr',
   'express',
   /\/schematics(\/|$)/,
+  /^@nx\/angular/,
   (pkg) => pkg.startsWith('@angular/') && !!pkg.match(/\/testing(\/|$)/),
   (pkg) => pkg.startsWith('@types/'),
 ];

libs/native-federation/migrate-appbuilder.md

@@ -125,4 +125,4 @@
         }
  }
 
-```
+```

libs/native-federation/package.json

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

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

@@ -55,28 +55,34 @@ export async function* runBuilder(
   context: BuilderContext
 ): AsyncIterable<BuilderOutput> {
   let target = targetFromTargetString(nfOptions.target);
-  
-  if (target.target === 'esbuild') {
-    logger.error('UPDATE NEEDED');
-    logger.error('')
-    logger.error('Since version 17.1, Native Federation uses Angular\'s');
-    logger.error('Application-Builder and its Dev-Server.');
-    logger.error('Please update your project config, e.g. in angular.json');
-    logger.error('');
-    logger.error('This command performs the needed update for default configs:');
-    logger.error('');
-    logger.error('\tng g @angular-architects/native-federation:appbuilder');
-    logger.error('');
-    logger.error('You need to run it once per application to migrate');
-    logger.error('Please find more information here: https://shorturl.at/gADJW');
-    return;
-  }
-  
+
   let _options = (await context.getTargetOptions(
     target
   )) as unknown as JsonObject & Schema;
 
   let builder = await context.getBuilderNameForTarget(target);
+
+  if (builder === '@angular-devkit/build-angular:browser-esbuild') {
+    logger.info('.: UPDATE NEEDED :.');
+    logger.info('');
+    logger.info("Since version 17.1, Native Federation uses Angular's");
+    logger.info('Application-Builder and its Dev-Server.');
+    logger.info('Please update your project config, e.g. in angular.json');
+    logger.info('');
+    logger.info(
+      'This command performs the needed update for default configs:'
+    );
+    logger.info('');
+    logger.info('\tng g @angular-architects/native-federation:appbuilder');
+    logger.info('');
+    logger.info('You need to run it once per application to migrate');
+    logger.info(
+      'Please find more information here: https://shorturl.at/gADJW'
+    );
+    return;
+
+  }
+
   let options = (await context.validateOptions(
     _options,
     builder

libs/native-federation/src/schematics/appbuilder/schematic.ts

@@ -40,20 +40,29 @@ function updateWorkspaceConfig(
   }
 
   if (projectConfig.architect.esbuild) {
-    projectConfig.architect.esbuild.builder = '@angular-devkit/build-angular:application';
-    projectConfig.architect.esbuild.options.browser = projectConfig.architect.esbuild.options.main;
+    projectConfig.architect.esbuild.builder =
+      '@angular-devkit/build-angular:application';
+    projectConfig.architect.esbuild.options.browser =
+      projectConfig.architect.esbuild.options.main;
     delete projectConfig.architect.esbuild.options.main;
   }
 
   if (projectConfig.architect['serve-original']) {
     const target = projectConfig.architect['serve-original'];
     if (target.configurations?.production) {
-      target.configurations.production.buildTarget = target.configurations.production.buildTarget.replace(':build:', ':esbuild:');
+      target.configurations.production.buildTarget =
+        target.configurations.production.buildTarget.replace(
+          ':build:',
+          ':esbuild:'
+        );
     }
     if (target.configurations?.development) {
-      target.configurations.development.buildTarget = target.configurations.development.buildTarget.replace(':build:', ':esbuild:');
+      target.configurations.development.buildTarget =
+        target.configurations.development.buildTarget.replace(
+          ':build:',
+          ':esbuild:'
+        );
     }
-
   }
 
   if (projectConfig.architect.serve) {

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

@@ -203,9 +203,9 @@ async function runEsbuild(
 
   const tailwindConfiguration = tailwindConfigurationPath
     ? {
-        file: tailwindConfigurationPath,
-        package: resolver.resolve('tailwindcss'),
-      }
+      file: tailwindConfigurationPath,
+      package: resolver.resolve('tailwindcss'),
+    }
     : undefined;
 
   const outputNames = {
@@ -222,11 +222,7 @@ async function runEsbuild(
     }
   }
 
-  if (fs.existsSync(path.join(workspaceRoot, 'tsconfig.base.json'))) {
-    tsConfigPath = 'tsconfig.base.json';
-  } else if (fs.existsSync(path.join(workspaceRoot, 'tsconfig.json'))) {
-    tsConfigPath = 'tsconfig.json';
-  }
+  tsConfigPath = createTsConfigForFederation(workspaceRoot, tsConfigPath, entryPoints);
 
   const pluginOptions = createCompilerPluginOptions(
     {
@@ -328,9 +324,47 @@ async function runEsbuild(
     ctx.dispose();
   }
 
+  cleanUpTsConfigForFederation(tsConfigPath);
+
   return writtenFiles;
 }
 
+function cleanUpTsConfigForFederation(tsConfigPath: string) {
+  if (tsConfigPath.includes('.federation.')) {
+    fs.unlinkSync(tsConfigPath);
+  }
+}
+
+function createTsConfigForFederation(workspaceRoot: string, tsConfigPath: string, entryPoints: EntryPoint[]) {
+  const fullTsConfigPath = path.join(workspaceRoot, tsConfigPath);
+  const tsconfigDir = path.dirname(fullTsConfigPath);
+
+  const filtered = entryPoints.filter(ep => !ep.fileName.includes('/node_modules/') && !ep.fileName.startsWith('.')).map(ep => path.relative(tsconfigDir, ep.fileName).replace(/\\\\/g, '/'));
+
+  const tsconfigAsString = fs.readFileSync(fullTsConfigPath, 'utf-8');
+  const tsconfigWithoutComments = tsconfigAsString.replace(
+      /\/\*.+?\*\/|\/\/.*(?=[\n\r])/g,
+      ''
+  );
+  const tsconfig = JSON.parse(tsconfigWithoutComments);
+
+
+  if (!tsconfig.include) {
+    tsconfig.include = [];
+  }
+
+  for (const ep of filtered) {
+    if (!tsconfig.include.includes(ep)) {
+      tsconfig.include.push(ep);
+    }
+  }
+
+  const tsconfigFedPath = path.join(tsconfigDir, 'tsconfig.federation.json');
+  fs.writeFileSync(tsconfigFedPath, JSON.stringify(tsconfig, null, 2));
+  tsConfigPath = tsconfigFedPath;
+  return tsConfigPath;
+}
+
 function writeResult(
   result: esbuild.BuildResult<esbuild.BuildOptions>,
   outdir: string,