diff --git a/packages/next/build/webpack-config.ts b/packages/next/build/webpack-config.ts
index 48d208912cb7..a42abcae003e 100644
--- a/packages/next/build/webpack-config.ts
+++ b/packages/next/build/webpack-config.ts
@@ -646,7 +646,9 @@ export default async function getBaseWebpackConfig(
           },
         }
       : undefined),
-    mainFields: !targetWeb ? ['main', 'module'] : ['browser', 'module', 'main'],
+    mainFields: targetWeb
+      ? (isEdgeRuntime ? [] : ['browser']).concat(['module', 'main'])
+      : ['main', 'module'],
     plugins: [],
   }
 
diff --git a/test/integration/react-streaming-and-server-components/app/node_modules/non-isomorphic-text/browser.js b/test/integration/react-streaming-and-server-components/app/node_modules/non-isomorphic-text/browser.js
new file mode 100644
index 000000000000..76b38b7d2ad9
--- /dev/null
+++ b/test/integration/react-streaming-and-server-components/app/node_modules/non-isomorphic-text/browser.js
@@ -0,0 +1 @@
+export default () => 'browser-field-export'
diff --git a/test/integration/react-streaming-and-server-components/app/node_modules/non-isomorphic-text/index.js b/test/integration/react-streaming-and-server-components/app/node_modules/non-isomorphic-text/index.js
new file mode 100644
index 000000000000..41865ae5aa7d
--- /dev/null
+++ b/test/integration/react-streaming-and-server-components/app/node_modules/non-isomorphic-text/index.js
@@ -0,0 +1 @@
+export default () => 'isomorphic-export'
diff --git a/test/integration/react-streaming-and-server-components/app/node_modules/non-isomorphic-text/package.json b/test/integration/react-streaming-and-server-components/app/node_modules/non-isomorphic-text/package.json
new file mode 100644
index 000000000000..bf2f13567110
--- /dev/null
+++ b/test/integration/react-streaming-and-server-components/app/node_modules/non-isomorphic-text/package.json
@@ -0,0 +1,5 @@
+{
+  "name": "non-isomorphic-text",
+  "module": "./index.js",
+  "browser": "./browser.js"
+}
diff --git a/test/integration/react-streaming-and-server-components/app/pages/external-imports.server.js b/test/integration/react-streaming-and-server-components/app/pages/external-imports.server.js
index 6627e3067542..40a41e569a75 100644
--- a/test/integration/react-streaming-and-server-components/app/pages/external-imports.server.js
+++ b/test/integration/react-streaming-and-server-components/app/pages/external-imports.server.js
@@ -1,5 +1,11 @@
 import moment from 'moment'
+import nonIsomorphicText from 'non-isomorphic-text'
 
 export default function Page() {
-  return <div>date:{moment().toString()}</div>
+  return (
+    <div>
+      <div>date:{moment().toString()}</div>
+      <div>{nonIsomorphicText()}</div>
+    </div>
+  )
 }
diff --git a/test/integration/react-streaming-and-server-components/test/rsc.js b/test/integration/react-streaming-and-server-components/test/rsc.js
index 5e7c60d3f4f5..8b4a8185022c 100644
--- a/test/integration/react-streaming-and-server-components/test/rsc.js
+++ b/test/integration/react-streaming-and-server-components/test/rsc.js
@@ -157,6 +157,11 @@ export default function (context, { runtime, env }) {
     })
   }
 
+  it('should not pick browser field from package.json for external libraries', async () => {
+    const html = await renderViaHTTP(context.appPort, '/external-imports')
+    expect(html).toContain('isomorphic-export')
+  })
+
   it('should handle various kinds of exports correctly', async () => {
     const html = await renderViaHTTP(context.appPort, '/various-exports')
     const content = getNodeBySelector(html, '#__next').text()