fix(module-federation): add tsconfig file for linting with TS webpack #20150

docs/generated/packages/angular/generators/setup-mf.json

@@ -78,6 +78,11 @@
         "type": "boolean",
         "description": "Whether the module federation configuration and webpack configuration files should use TS.",
         "default": true
+      },
+      "setParserOptionsProject": {
+        "type": "boolean",
+        "description": "Whether or not to configure the ESLint `parserOptions.project` option. We do not do this by default for lint performance reasons.",
+        "default": false
       }
     },
     "required": ["appName", "mfType"],

packages/angular/src/generators/host/host.ts

@@ -74,6 +74,7 @@ export async function hostInternal(tree: Tree, schema: Schema) {
     prefix: options.prefix,
     typescriptConfiguration,
     standalone: options.standalone,
+    setParserOptionsProject: options.setParserOptionsProject,
   });
 
   let installTasks = [appInstallTask];

packages/angular/src/generators/remote/remote.ts

@@ -68,6 +68,7 @@ export async function remoteInternal(tree: Tree, schema: Schema) {
     standalone: options.standalone,
     prefix: options.prefix,
     typescriptConfiguration,
+    setParserOptionsProject: options.setParserOptionsProject,
   });
 
   const installSwcHelpersTask = addDependenciesToPackageJson(

packages/angular/src/generators/setup-mf/files/ts-webpack/tsconfig.lint.json__tmpl__

@@ -0,0 +1,12 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "target": "ES2020"
+  },
+  "include": [
+    "src/main.ts",
+    <% if(type === "remote") { %> "src/remote-entry/<% if(standalone) { %>entry.routes.ts", <% } else { %> entry.module.ts", <% } } %>
+    "webpack.config.ts",
+    "webpack.prod.config.ts"
+  ]
+}

packages/angular/src/generators/setup-mf/lib/generate-config.ts

@@ -39,4 +39,8 @@ export function generateWebpackConfig(
       standalone: options.standalone,
     }
   );
+
+  if (!options.setParserOptionsProject) {
+    tree.delete(joinPathFragments(appRoot, 'tsconfig.lint.json'));
+  }
 }

packages/angular/src/generators/setup-mf/schema.d.ts

@@ -15,6 +15,7 @@ export interface Schema {
   standalone?: boolean;
   skipE2E?: boolean;
   typescriptConfiguration?: boolean;
+  setParserOptionsProject?: boolean;
 }
 
 export interface NormalizedOptions extends Schema {

packages/angular/src/generators/setup-mf/schema.json

@@ -78,6 +78,11 @@
       "type": "boolean",
       "description": "Whether the module federation configuration and webpack configuration files should use TS.",
       "default": true
+    },
+    "setParserOptionsProject": {
+      "type": "boolean",
+      "description": "Whether or not to configure the ESLint `parserOptions.project` option. We do not do this by default for lint performance reasons.",
+      "default": false
     }
   },
   "required": ["appName", "mfType"],

packages/react/src/generators/host/files/common/tsconfig.lint.json__tmpl__

@@ -0,0 +1,19 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "types": [
+        "node",
+        "@nx/react/typings/cssmodule.d.ts",
+        "@nx/react/typings/image.d.ts"
+    ]
+  },
+  "include": [
+    "src/**/*.js",
+    "src/**/*.jsx",
+    "src/**/*.ts",
+    "src/**/*.tsx",
+    "webpack.config.ts",
+    "webpack.prod.config.ts"
+  ]
+}

packages/react/src/generators/host/host.ts

@@ -105,6 +105,12 @@ export async function hostGeneratorInternal(
     updateProjectConfiguration(host, options.projectName, projectConfig);
   }
 
+  if (!options.setParserOptionsProject) {
+    host.delete(
+      joinPathFragments(options.appProjectRoot, 'tsconfig.lint.json')
+    );
+  }
+
   if (!options.skipFormat) {
     await formatFiles(host);
   }

packages/react/src/generators/remote/files/module-federation-ssr-ts/tsconfig.lint.json__tmpl__

@@ -0,0 +1,19 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "types": [
+        "node",
+        "@nx/react/typings/cssmodule.d.ts",
+        "@nx/react/typings/image.d.ts"
+    ]
+  },
+  "include": [
+    "src/**/*.js",
+    "src/**/*.jsx",
+    "src/**/*.ts",
+    "src/**/*.tsx",
+    "webpack.config.ts",
+    "webpack.prod.config.ts"
+  ]
+}

packages/react/src/generators/remote/files/module-federation-ts/tsconfig.lint.json__tmpl__

@@ -0,0 +1,19 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "types": [
+        "node",
+        "@nx/react/typings/cssmodule.d.ts",
+        "@nx/react/typings/image.d.ts"
+    ]
+  },
+  "include": [
+    "src/**/*.js",
+    "src/**/*.jsx",
+    "src/**/*.ts",
+    "src/**/*.tsx",
+    "webpack.config.ts",
+    "webpack.prod.config.ts"
+  ]
+}

packages/react/src/generators/remote/remote.ts

@@ -119,6 +119,11 @@ export async function remoteGeneratorInternal(host: Tree, schema: Schema) {
     );
     updateProjectConfiguration(host, options.projectName, projectConfig);
   }
+  if (!options.setParserOptionsProject) {
+    host.delete(
+      joinPathFragments(options.appProjectRoot, 'tsconfig.lint.json')
+    );
+  }
 
   if (!options.skipFormat) {
     await formatFiles(host);