Add configuration flags to disable integrated type checker

packages/next/README.md

@@ -2316,6 +2316,18 @@ To learn more about TypeScript checkout its [documentation](https://www.typescri
 > **Note**: Next.js does not enable TypeScript's `strict` mode by default.
 > When you feel comfortable with TypeScript, you may turn this option on in your `tsconfig.json`.
 
+> **Note**: By default, Next.js reports all TypeScript errors during dev and prevents application build if any are detected.
+> If you don't want to leverage this behaviour and prefer to do type checks manually, set the following option in your `next.config.js`:
+>
+> ```js
+> // next.config.js
+> module.exports = {
+>   typescript: {
+>     transpileOnly: true,
+>   },
+> }
+> ```
+
 ### Exported types
 
 Next.js provides `NextPage` type that can be used for pages in the `pages` directory. `NextPage` adds definitions for [`getInitialProps`](#fetching-data-and-component-lifecycle) so that it can be used without any extra typing needed.

packages/next/build/output/store.ts

@@ -78,7 +78,7 @@ store.subscribe(state => {
   }
 
   if (state.typeChecking) {
-    Log.info('bundled successfully, waiting for typecheck results ...')
+    Log.info('bundled successfully, waiting for typecheck results...')
     return
   }
 

packages/next/build/webpack-config.ts

@@ -126,6 +126,8 @@ export default async function getBaseWebpackConfig(
   const useTypeScript = Boolean(
     typeScriptPath && (await fileExists(tsConfigPath))
   )
+  const typescriptTranspileOnly =
+    config.typescript && config.typescript.transpileOnly
 
   const resolveConfig = {
     // Disable .mjs for node_modules bundling
@@ -839,6 +841,7 @@ export default async function getBaseWebpackConfig(
         }),
       !isServer &&
         useTypeScript &&
+        !typescriptTranspileOnly &&
         new ForkTsCheckerWebpackPlugin(
           PnpWebpackPlugin.forkTsCheckerOptions({
             typescript: typeScriptPath,

packages/next/server/hot-reloader.ts

@@ -349,11 +349,13 @@ export default class HotReloader {
   async prepareBuildTools(multiCompiler: webpack.MultiCompiler) {
     const tsConfigPath = join(this.dir, 'tsconfig.json')
     const useTypeScript = await fileExists(tsConfigPath)
+    const typescriptTranspileOnly =
+      this.config.typescript && this.config.typescript.transpileOnly
 
     watchCompilers(
       multiCompiler.compilers[0],
       multiCompiler.compilers[1],
-      useTypeScript,
+      useTypeScript && !typescriptTranspileOnly,
       ({ errors, warnings }) => this.send('typeChecked', { errors, warnings })
     )