Fix external check for non-local next import

packages/next/build/webpack-config.ts

@@ -176,6 +176,7 @@ const WEBPACK_RESOLVE_OPTIONS = {
   // Otherwise combined ESM+CJS packages will never be external
   // as resolving mismatch would lead to opt-out from being external.
   dependencyType: 'commonjs',
+  symlinks: true,
 }
 
 const NODE_RESOLVE_OPTIONS = {
@@ -739,6 +740,14 @@ export default async function getBaseWebpackConfig(
       return
     }
 
+    if (
+      res.match(
+        /next[/\\]dist[/\\]next-server[/\\](?!lib[/\\]router[/\\]router)/
+      )
+    ) {
+      return `commonjs ${request}`
+    }
+
     // Default pages have to be transpiled
     if (
       res.match(/[/\\]next[/\\]dist[/\\]/) ||

test/integration/getserversideprops/pages/index.js

@@ -1,6 +1,41 @@
 import Link from 'next/link'
+import ReactDOM from 'react-dom/server'
+import { RouterContext } from 'next/dist/next-server/lib/router-context'
+import { useRouter } from 'next/router'
 
-export async function getServerSideProps({ req }) {
+function RouterComp(props) {
+  const router = useRouter()
+
+  if (!router) {
+    throw new Error('router is missing!')
+  }
+
+  return (
+    <>
+      <p>props {JSON.stringify(props)}</p>
+      <p>router: {JSON.stringify(router)}</p>
+    </>
+  )
+}
+
+export async function getServerSideProps({ req, query, preview }) {
+  // this ensures the same router context is used by the useRouter hook
+  // no matter where it is imported
+  console.log(
+    ReactDOM.renderToString(
+      <RouterContext.Provider
+        value={{
+          query,
+          pathname: '/',
+          asPath: req.url,
+          isPreview: preview,
+        }}
+      >
+        <p>hello world</p>
+        <RouterComp hello={'world'} />
+      </RouterContext.Provider>
+    )
+  )
   return {
     props: {
       url: req.url,