Fail production build quickly (vercel#13496)

By default, webpack will proceed to run loaders and plugins on all files, even after an error has been encountered during the build process.

This means you might need to wait minutes to see a syntax error encountered in one of your source files. This PR fixes that.

packages/next/build/compiler.ts

@@ -26,6 +26,10 @@ export function runCompiler(
     compiler.run(
       (err: Error, statsOrMultiStats: { stats: Stats[] } | Stats) => {
         if (err) {
+          const reason = err?.toString()
+          if (reason) {
+            return resolve({ errors: [reason], warnings: [] })
+          }
           return reject(err)
         }
 

packages/next/build/webpack/config/blocks/base.ts

@@ -10,6 +10,11 @@ export const base = curry(function base(
   config.name = ctx.isServer ? 'server' : 'client'
   config.target = ctx.isServer ? 'node' : 'web'
 
+  // Stop compilation early in a production build when an error is encountered.
+  // This behavior isn't desirable in development due to how the HMR system
+  // works, but is a good default for production.
+  config.bail = ctx.isProduction
+
   // https://webpack.js.org/configuration/devtool/#development
   if (ctx.isDevelopment) {
     if (process.platform === 'win32') {

test/integration/config/next.config.js

@@ -19,7 +19,16 @@ module.exports = withCSS(
     env: {
       customVar: 'hello',
     },
-    webpack(config, { buildId, webpack }) {
+    webpack(config, { dev, buildId, webpack }) {
+      if (dev) {
+        if (config.bail !== false) {
+          throw new Error('Wrong bail value for development!')
+        }
+      } else {
+        if (config.bail !== true) {
+          throw new Error('Wrong bail value for production!')
+        }
+      }
       // When next-css is `npm link`ed we have to solve loaders from the project root
       const nextLocation = path.join(
         require.resolve('next/package.json'),