Add conflicting app and page error (vercel#41099)

This adds a proper error when we detect conflicting app and page paths. 

Fixes: https://vercel.slack.com/archives/C043ANYDB24/p1664678172389449

## Bug

- [x] Related issues linked using `fixes #number`
- [x] Integration tests added
- [ ] Errors have a helpful link attached, see `contributing.md`

Co-authored-by: Sukka <isukkaw@gmail.com>

packages/next/build/index.ts

@@ -551,6 +551,28 @@ export default async function build(
           : undefined,
       }
 
+      if (pageKeys.app) {
+        const conflictingAppPagePaths = []
+
+        for (const appPath of pageKeys.app) {
+          if (pageKeys.pages.includes(appPath)) {
+            conflictingAppPagePaths.push(`pages${appPath} - app${appPath}`)
+          }
+        }
+        const numConflicting = conflictingAppPagePaths.length
+
+        if (numConflicting > 0) {
+          Log.error(
+            `Conflicting app and page file${
+              numConflicting === 1 ? ' was' : 's were'
+            } found, please remove the conflicting files to continue. \n${conflictingAppPagePaths.join(
+              '\n'
+            )}\n`
+          )
+          process.exit(1)
+        }
+      }
+
       const conflictingPublicFiles: string[] = []
       const hasPages404 = mappedPages['/404']?.startsWith(PAGES_DIR_ALIAS)
       const hasCustomErrorPage =

test/integration/conflicting-app-page-error/app/another/page.js

@@ -0,0 +1,3 @@
+export default function Page(props) {
+  return <p>another app</p>
+}

test/integration/conflicting-app-page-error/app/hello/page.js

@@ -0,0 +1,3 @@
+export default function Page(props) {
+  return <p>hello app</p>
+}

test/integration/conflicting-app-page-error/app/non-conflict/page.js

@@ -0,0 +1,3 @@
+export default function Page(props) {
+  return <p>another app</p>
+}

test/integration/conflicting-app-page-error/next.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  experimental: {
+    appDir: true,
+  },
+}

test/integration/conflicting-app-page-error/pages/another.js

@@ -0,0 +1,3 @@
+export default function Page(props) {
+  return <p>another page</p>
+}

test/integration/conflicting-app-page-error/pages/hello.js

@@ -0,0 +1,3 @@
+export default function Page(props) {
+  return <p>hello page</p>
+}

test/integration/conflicting-app-page-error/test/index.test.js

@@ -0,0 +1,20 @@
+/* eslint-env jest */
+
+import path from 'path'
+import { nextBuild } from 'next-test-utils'
+
+const appDir = path.join(__dirname, '..')
+
+describe('conflict between app file and page file', () => {
+  it('errors during build', async () => {
+    const conflicts = ['/hello', '/another']
+    const results = await nextBuild(appDir, [], { stdout: true, stderr: true })
+    const output = results.stdout + results.stderr
+    expect(output).toMatch(/Conflicting app and page files were found/)
+
+    for (const conflict of conflicts) {
+      expect(output).toContain(conflict)
+    }
+    expect(output).not.toContain('/non-conflict')
+  })
+})