fix(nextjs): remove tsconfig.app.json (#4970)

e2e/next/src/next.test.ts

@@ -314,6 +314,34 @@ describe('Next.js Applications', () => {
       checkE2E: true,
     });
   }, 180000);
+
+  it('should fail the build when TS errors are present', async () => {
+    const appName = uniq('app');
+
+    runCLI(
+      `generate @nrwl/next:app ${appName} --no-interactive --style=@emotion/styled`
+    );
+
+    updateFile(
+      `apps/${appName}/pages/index.tsx`,
+      `
+        import React from 'react';
+
+        export function Index() {
+          let x = '';
+          // below is an intentional TS error
+          x = 3;
+          return <div />;
+        }
+
+        export default Index;
+        `
+    );
+
+    expect(() => runCLI(`build ${appName}`)).toThrowError(
+      `Type error: Type 'number' is not assignable to type 'string'.`
+    );
+  }, 120000);
 });
 
 async function checkApp(

packages/next/src/generators/application/application.spec.ts

@@ -47,7 +47,6 @@ describe('app', () => {
     it('should generate files', async () => {
       await applicationGenerator(tree, { name: 'myApp', style: 'css' });
       expect(tree.exists('apps/my-app/tsconfig.json')).toBeTruthy();
-      expect(tree.exists('apps/my-app/tsconfig.app.json')).toBeTruthy();
       expect(tree.exists('apps/my-app/pages/index.tsx')).toBeTruthy();
       expect(tree.exists('apps/my-app/specs/index.spec.tsx')).toBeTruthy();
       expect(tree.exists('apps/my-app/pages/index.module.css')).toBeTruthy();
@@ -286,7 +285,7 @@ describe('app', () => {
                 ],
                 "parserOptions": Object {
                   "project": Array [
-                    "apps/my-app/tsconfig.*?.json",
+                    "apps/my-app/tsconfig(.*)?.json",
                   ],
                 },
                 "rules": Object {},
@@ -351,9 +350,9 @@ describe('app', () => {
       const tsConfig = readJson(tree, 'apps/my-app/tsconfig.json');
       expect(tsConfig.compilerOptions.allowJs).toEqual(true);
 
-      const tsConfigApp = readJson(tree, 'apps/my-app/tsconfig.app.json');
+      const tsConfigApp = readJson(tree, 'apps/my-app/tsconfig.json');
       expect(tsConfigApp.include).toContain('**/*.js');
-      expect(tsConfigApp.exclude).toContain('**/*.spec.js');
+      expect(tsConfigApp.exclude).not.toContain('**/*.spec.js');
     });
   });
 });

packages/next/src/generators/application/files/next-env.d.ts__tmpl__

@@ -1,2 +1,13 @@
 /// <reference types="next" />
 /// <reference types="next/types/global" />
+<% if (style === 'less') { %>
+declare module '*.module.less' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+<% } else if (style === 'styl') { %>
+declare module '*.module.styl' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+<% } %>

packages/next/src/generators/application/files/tsconfig.app.json__tmpl__

@@ -1,9 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "<%= offsetFromRoot %>dist/out-tsc",
-    "types": ["node", "jest"]
-  },
-  "exclude": ["**/*.spec.ts", "**/*.spec.tsx", "**/*.spec.js", "**/*.spec.jsx"],
-  "include": ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx", "next-env.d.ts"]
-}

packages/next/src/generators/application/files/tsconfig.json__tmpl__

@@ -5,18 +5,13 @@
     "allowJs": true,
     "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,
+    "types": ["node", "jest"],
     "strict": false,
     "forceConsistentCasingInFileNames": true,
     "noEmit": true,
     "resolveJsonModule": true,
     "isolatedModules": true
   },
-  "files": [],
-  "include": [],
-  "references": [
-    {
-      "path": "./tsconfig.app.json"
-    }
-  ],
+  "include": ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx", "next-env.d.ts"],
   "exclude": ["node_modules"]
 }

packages/next/src/generators/application/lib/add-linting.ts

@@ -29,7 +29,14 @@ export async function addLinting(
     updateJson(
       host,
       joinPathFragments(options.appProjectRoot, '.eslintrc.json'),
-      () => reactEslintJson
+      () => {
+        if (reactEslintJson.overrides?.[0].parserOptions?.project) {
+          reactEslintJson.overrides[0].parserOptions.project = [
+            `${options.appProjectRoot}/tsconfig(.*)?.json`,
+          ];
+        }
+        return reactEslintJson;
+      }
     );
   }
 

packages/next/src/generators/application/lib/create-application-files.ts

@@ -52,6 +52,5 @@ export function createApplicationFiles(host: Tree, options: NormalizedSchema) {
   if (options.js) {
     host.delete(`${options.appProjectRoot}/index.d.ts`);
     toJS(host);
-    updateTsConfigsToJs(host, { projectRoot: options.appProjectRoot });
   }
 }