From c868e6466410fd549f174c727d69633d59cb5680 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=BF=A0=20/=20green?= <green@sapphi.red>
Date: Thu, 11 Aug 2022 04:50:48 +0900
Subject: [PATCH] fix: use browser field if it is not likely UMD or CJS (fixes
 #9445) (#9459)

---
 packages/vite/src/node/plugins/resolve.ts            |  2 ++
 playground/resolve/__tests__/resolve.spec.ts         |  8 ++++++++
 playground/resolve/browser-module-field1/index.js    |  1 +
 .../resolve/browser-module-field1/index.web.js       |  1 +
 .../resolve/browser-module-field1/package.json       |  8 ++++++++
 playground/resolve/browser-module-field2/index.js    |  1 +
 .../resolve/browser-module-field2/index.web.js       |  1 +
 .../resolve/browser-module-field2/package.json       |  7 +++++++
 playground/resolve/index.html                        | 12 ++++++++++++
 playground/resolve/package.json                      |  2 ++
 pnpm-lock.yaml                                       | 10 ++++++++++
 11 files changed, 53 insertions(+)
 create mode 100644 playground/resolve/browser-module-field1/index.js
 create mode 100644 playground/resolve/browser-module-field1/index.web.js
 create mode 100644 playground/resolve/browser-module-field1/package.json
 create mode 100644 playground/resolve/browser-module-field2/index.js
 create mode 100644 playground/resolve/browser-module-field2/index.web.js
 create mode 100644 playground/resolve/browser-module-field2/package.json

diff --git a/packages/vite/src/node/plugins/resolve.ts b/packages/vite/src/node/plugins/resolve.ts
index e0297fea18e782..f1878e89d17433 100644
--- a/packages/vite/src/node/plugins/resolve.ts
+++ b/packages/vite/src/node/plugins/resolve.ts
@@ -867,6 +867,8 @@ export function resolvePackageEntry(
             ) {
               // likely UMD or CJS(!!! e.g. firebase 7.x), prefer module
               entryPoint = data.module
+            } else {
+              entryPoint = browserEntry
             }
           }
         } else {
diff --git a/playground/resolve/__tests__/resolve.spec.ts b/playground/resolve/__tests__/resolve.spec.ts
index e95e6d78c409c5..ef125d4409ec9b 100644
--- a/playground/resolve/__tests__/resolve.spec.ts
+++ b/playground/resolve/__tests__/resolve.spec.ts
@@ -87,6 +87,14 @@ test('browser field', async () => {
   expect(await page.textContent('.browser')).toMatch('[success]')
 })
 
+test('Resolve browser field even if module field exists', async () => {
+  expect(await page.textContent('.browser-module1')).toMatch('[success]')
+})
+
+test('Resolve module field if browser field is likely UMD or CJS', async () => {
+  expect(await page.textContent('.browser-module2')).toMatch('[success]')
+})
+
 test('css entry', async () => {
   expect(await page.textContent('.css')).toMatch('[success]')
 })
diff --git a/playground/resolve/browser-module-field1/index.js b/playground/resolve/browser-module-field1/index.js
new file mode 100644
index 00000000000000..ce45a76e78514d
--- /dev/null
+++ b/playground/resolve/browser-module-field1/index.js
@@ -0,0 +1 @@
+export default '[fail] this should not run in the browser'
diff --git a/playground/resolve/browser-module-field1/index.web.js b/playground/resolve/browser-module-field1/index.web.js
new file mode 100644
index 00000000000000..99af62f8e3700e
--- /dev/null
+++ b/playground/resolve/browser-module-field1/index.web.js
@@ -0,0 +1 @@
+export default '[success] this should run in browser'
diff --git a/playground/resolve/browser-module-field1/package.json b/playground/resolve/browser-module-field1/package.json
new file mode 100644
index 00000000000000..b9186cf67fc560
--- /dev/null
+++ b/playground/resolve/browser-module-field1/package.json
@@ -0,0 +1,8 @@
+{
+  "name": "resolve-browser-module-field1",
+  "private": true,
+  "version": "1.0.0",
+  "//": "real world example: https://github.com/aws/aws-sdk-js-v3/blob/59cdfd81452bce16bb26d07668e5550ed05d9d06/packages/credential-providers/package.json#L6-L7",
+  "module": "index.js",
+  "browser": "index.web.js"
+}
diff --git a/playground/resolve/browser-module-field2/index.js b/playground/resolve/browser-module-field2/index.js
new file mode 100644
index 00000000000000..99af62f8e3700e
--- /dev/null
+++ b/playground/resolve/browser-module-field2/index.js
@@ -0,0 +1 @@
+export default '[success] this should run in browser'
diff --git a/playground/resolve/browser-module-field2/index.web.js b/playground/resolve/browser-module-field2/index.web.js
new file mode 100644
index 00000000000000..172aa9928c86ae
--- /dev/null
+++ b/playground/resolve/browser-module-field2/index.web.js
@@ -0,0 +1 @@
+module.exports = '[fail] this should not run in the browser'
diff --git a/playground/resolve/browser-module-field2/package.json b/playground/resolve/browser-module-field2/package.json
new file mode 100644
index 00000000000000..ca43d33ff9a6f6
--- /dev/null
+++ b/playground/resolve/browser-module-field2/package.json
@@ -0,0 +1,7 @@
+{
+  "name": "resolve-browser-module-field2",
+  "private": true,
+  "version": "1.0.0",
+  "module": "index.js",
+  "browser": "index.web.js"
+}
diff --git a/playground/resolve/index.html b/playground/resolve/index.html
index 674819fc0195a6..7502c422e0eb82 100644
--- a/playground/resolve/index.html
+++ b/playground/resolve/index.html
@@ -76,6 +76,12 @@ <h2>Resolve absolute path</h2>
 <h2>Browser Field</h2>
 <p class="browser">fail</p>
 
+<h2>Resolve browser field even if module field exists</h2>
+<p class="browser-module1">fail</p>
+
+<h2>Resolve module field if browser field is likely UMD or CJS</h2>
+<p class="browser-module2">fail</p>
+
 <h2>Don't resolve to the `module` field if the importer is a `require` call</h2>
 <p class="require-pkg-with-module-field">fail</p>
 
@@ -213,6 +219,12 @@ <h2>resolve package that contains # in path</h2>
     text('.browser', main)
   }
 
+  import browserModule1 from 'resolve-browser-module-field1'
+  text('.browser-module1', browserModule1)
+
+  import browserModule2 from 'resolve-browser-module-field2'
+  text('.browser-module2', browserModule2)
+
   import { msg as requireButWithModuleFieldMsg } from 'require-pkg-with-module-field'
   text('.require-pkg-with-module-field', requireButWithModuleFieldMsg)
 
diff --git a/playground/resolve/package.json b/playground/resolve/package.json
index 6bdf7544a99c8d..5763ad88b79ead 100644
--- a/playground/resolve/package.json
+++ b/playground/resolve/package.json
@@ -14,6 +14,8 @@
     "normalize.css": "^8.0.1",
     "require-pkg-with-module-field": "link:./require-pkg-with-module-field",
     "resolve-browser-field": "link:./browser-field",
+    "resolve-browser-module-field1": "link:./browser-module-field1",
+    "resolve-browser-module-field2": "link:./browser-module-field2",
     "resolve-custom-condition": "link:./custom-condition",
     "resolve-custom-main-field": "link:./custom-main-field",
     "resolve-exports-env": "link:./exports-env",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 3954300280e8e2..6261eb2fcba374 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -845,6 +845,8 @@ importers:
       normalize.css: ^8.0.1
       require-pkg-with-module-field: link:./require-pkg-with-module-field
       resolve-browser-field: link:./browser-field
+      resolve-browser-module-field1: link:./browser-module-field1
+      resolve-browser-module-field2: link:./browser-module-field2
       resolve-custom-condition: link:./custom-condition
       resolve-custom-main-field: link:./custom-main-field
       resolve-exports-env: link:./exports-env
@@ -856,6 +858,8 @@ importers:
       normalize.css: 8.0.1
       require-pkg-with-module-field: link:require-pkg-with-module-field
       resolve-browser-field: link:browser-field
+      resolve-browser-module-field1: link:browser-module-field1
+      resolve-browser-module-field2: link:browser-module-field2
       resolve-custom-condition: link:custom-condition
       resolve-custom-main-field: link:custom-main-field
       resolve-exports-env: link:exports-env
@@ -871,6 +875,12 @@ importers:
   playground/resolve/browser-field:
     specifiers: {}
 
+  playground/resolve/browser-module-field1:
+    specifiers: {}
+
+  playground/resolve/browser-module-field2:
+    specifiers: {}
+
   playground/resolve/custom-condition:
     specifiers: {}