Uses the PnP API when available (#8668)

* Uses the PnP API when available

* Moves the resolution into an helper

* Update packages/next/lib/resolve-request.ts

Co-Authored-By: Joe Haddad <joe.haddad@zeit.co>

* Apply Prettier

packages/next/build/webpack-config.ts

@@ -6,7 +6,7 @@ import {
   SERVER_DIRECTORY,
   SERVERLESS_DIRECTORY,
 } from '../next-server/lib/constants'
-import resolve from 'next/dist/compiled/resolve/index.js'
+import { resolveRequest } from '../lib/resolve-request'
 import path from 'path'
 import crypto from 'crypto'
 import webpack from 'webpack'
@@ -113,7 +113,7 @@ export default async function getBaseWebpackConfig(
 
   let typeScriptPath
   try {
-    typeScriptPath = resolve.sync('typescript', { basedir: dir })
+    typeScriptPath = resolveRequest('typescript', `${dir}/`)
   } catch (_) {}
   const tsConfigPath = path.join(dir, 'tsconfig.json')
   const useTypeScript = Boolean(
@@ -314,45 +314,40 @@ export default async function getBaseWebpackConfig(
               return callback()
             }
 
-            resolve(
-              request,
-              { basedir: context, preserveSymlinks: true },
-              (err, res) => {
-                if (err) {
-                  return callback()
-                }
+            let res
+            try {
+              res = resolveRequest(request, context)
+            } catch (err) {
+              return callback()
+            }
 
-                if (!res) {
-                  return callback()
-                }
+            if (!res) {
+              return callback()
+            }
 
-                // Default pages have to be transpiled
-                if (
-                  !res.match(/next[/\\]dist[/\\]next-server[/\\]/) &&
-                  (res.match(/next[/\\]dist[/\\]/) ||
-                    res.match(/node_modules[/\\]@babel[/\\]runtime[/\\]/) ||
-                    res.match(
-                      /node_modules[/\\]@babel[/\\]runtime-corejs2[/\\]/
-                    ))
-                ) {
-                  return callback()
-                }
+            // Default pages have to be transpiled
+            if (
+              !res.match(/next[/\\]dist[/\\]next-server[/\\]/) &&
+              (res.match(/next[/\\]dist[/\\]/) ||
+                res.match(/node_modules[/\\]@babel[/\\]runtime[/\\]/) ||
+                res.match(/node_modules[/\\]@babel[/\\]runtime-corejs2[/\\]/))
+            ) {
+              return callback()
+            }
 
-                // Webpack itself has to be compiled because it doesn't always use module relative paths
-                if (
-                  res.match(/node_modules[/\\]webpack/) ||
-                  res.match(/node_modules[/\\]css-loader/)
-                ) {
-                  return callback()
-                }
+            // Webpack itself has to be compiled because it doesn't always use module relative paths
+            if (
+              res.match(/node_modules[/\\]webpack/) ||
+              res.match(/node_modules[/\\]css-loader/)
+            ) {
+              return callback()
+            }
 
-                if (res.match(/node_modules[/\\].*\.js$/)) {
-                  return callback(undefined, `commonjs ${request}`)
-                }
+            if (res.match(/node_modules[/\\].*\.js$/)) {
+              return callback(undefined, `commonjs ${request}`)
+            }
 
-                callback()
-              }
-            )
+            callback()
           },
         ]
       : [

packages/next/lib/resolve-request.ts

@@ -0,0 +1,19 @@
+import resolve from 'next/dist/compiled/resolve/index.js'
+import path from 'path'
+
+export function resolveRequest(req: string, issuer: string) {
+  // The `resolve` package is prebuilt through ncc, which prevents
+  // PnP from being able to inject itself into it. To circumvent
+  // this, we simply use PnP directly when available.
+  // @ts-ignore
+  if (process.versions.pnp) {
+    const { resolveRequest } = require(`pnpapi`)
+    return resolveRequest(req, issuer, { considerBuiltins: false })
+  } else {
+    const basedir =
+      issuer.endsWith(path.posix.sep) || issuer.endsWith(path.win32.sep)
+        ? issuer
+        : path.dirname(issuer)
+    return resolve.sync(req, { basedir })
+  }
+}

packages/next/lib/verifyTypeScriptSetup.ts

@@ -1,12 +1,12 @@
 import chalk from 'chalk'
 import fs from 'fs'
-import resolve from 'next/dist/compiled/resolve/index.js'
 import os from 'os'
 import path from 'path'
 import { promisify } from 'util'
 
 import { fileExists } from './file-exists'
 import { recursiveReadDir } from './recursive-readdir'
+import { resolveRequest } from './resolve-request'
 
 const writeFile = promisify(fs.writeFile)
 const readFile = promisify(fs.readFile)
@@ -43,7 +43,7 @@ async function checkDependencies({
 
   const missingPackages = requiredPackages.filter(p => {
     try {
-      resolve.sync(p.file, { basedir: dir })
+      resolveRequest(p.file, `${dir}/`)
     } catch (_) {
       return true
     }