From 4924d2b881ca5a8527cf09297859a3c8e5c42f1b Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Sun, 15 Aug 2021 20:08:39 +0800
Subject: [PATCH 01/13] feat(nested-deps): setup test package

---
 packages/playground/nested-deps/index.html             | 10 ++++++++++
 packages/playground/nested-deps/package.json           |  3 ++-
 .../playground/nested-deps/test-package-d/index.js     |  3 +++
 .../playground/nested-deps/test-package-d/package.json |  8 ++++++++
 .../test-package-d/test-package-d-nested/index.js      |  1 +
 .../test-package-d/test-package-d-nested/package.json  |  5 +++++
 packages/playground/nested-deps/vite.config.js         |  6 ++++--
 yarn.lock                                              |  8 ++++++++
 8 files changed, 41 insertions(+), 3 deletions(-)
 create mode 100644 packages/playground/nested-deps/test-package-d/index.js
 create mode 100644 packages/playground/nested-deps/test-package-d/package.json
 create mode 100644 packages/playground/nested-deps/test-package-d/test-package-d-nested/index.js
 create mode 100644 packages/playground/nested-deps/test-package-d/test-package-d-nested/package.json

diff --git a/packages/playground/nested-deps/index.html b/packages/playground/nested-deps/index.html
index 86a7268cd169d7..3467c3d9e425af 100644
--- a/packages/playground/nested-deps/index.html
+++ b/packages/playground/nested-deps/index.html
@@ -13,11 +13,18 @@ <h2>direct dependency C</h2>
 <h2>side dependency C</h2>
 <pre class="side-c"></pre>
 
+<h2>direct dependency D</h2>
+<pre class="d"></pre>
+
+<h2>nested dependency nested-D (dep of D)</h2>
+<pre class="nested-d"></pre>
+
 <script type="module">
   import A from 'test-package-a'
   import B, { A as nestedA } from 'test-package-b'
   import C from 'test-package-c'
   import { C as sideC } from 'test-package-c/side'
+  import D, { nestedD } from 'test-package-d'
 
   text('.a', A)
   text('.b', B)
@@ -26,6 +33,9 @@ <h2>side dependency C</h2>
   text('.c', C)
   text('.side-c', sideC)
 
+  text('.d', D)
+  text('.nested-d', nestedD)
+
   function text(sel, text) {
     document.querySelector(sel).textContent = text
   }
diff --git a/packages/playground/nested-deps/package.json b/packages/playground/nested-deps/package.json
index d6276f4c5185b8..e705a5c96ae103 100644
--- a/packages/playground/nested-deps/package.json
+++ b/packages/playground/nested-deps/package.json
@@ -11,6 +11,7 @@
   "dependencies": {
     "test-package-a": "link:./test-package-a",
     "test-package-b": "link:./test-package-b",
-    "test-package-c": "link:./test-package-c"
+    "test-package-c": "link:./test-package-c",
+    "test-package-d": "link:./test-package-d"
   }
 }
diff --git a/packages/playground/nested-deps/test-package-d/index.js b/packages/playground/nested-deps/test-package-d/index.js
new file mode 100644
index 00000000000000..f5b35d06fd5001
--- /dev/null
+++ b/packages/playground/nested-deps/test-package-d/index.js
@@ -0,0 +1,3 @@
+export { default as nestedD } from 'test-package-d-nested'
+
+export default 'D@1.0.0'
diff --git a/packages/playground/nested-deps/test-package-d/package.json b/packages/playground/nested-deps/test-package-d/package.json
new file mode 100644
index 00000000000000..e97830636596fc
--- /dev/null
+++ b/packages/playground/nested-deps/test-package-d/package.json
@@ -0,0 +1,8 @@
+{
+  "name": "test-package-d",
+  "version": "1.0.0",
+  "main": "index.js",
+  "dependencies": {
+    "test-package-d-nested": "link:./test-package-d-nested"
+  }
+}
diff --git a/packages/playground/nested-deps/test-package-d/test-package-d-nested/index.js b/packages/playground/nested-deps/test-package-d/test-package-d-nested/index.js
new file mode 100644
index 00000000000000..f5d878046a8ca3
--- /dev/null
+++ b/packages/playground/nested-deps/test-package-d/test-package-d-nested/index.js
@@ -0,0 +1 @@
+export default 'nested-D@1.0.0'
diff --git a/packages/playground/nested-deps/test-package-d/test-package-d-nested/package.json b/packages/playground/nested-deps/test-package-d/test-package-d-nested/package.json
new file mode 100644
index 00000000000000..deb92dc84767fd
--- /dev/null
+++ b/packages/playground/nested-deps/test-package-d/test-package-d-nested/package.json
@@ -0,0 +1,5 @@
+{
+  "name": "test-package-d-nested",
+  "version": "1.0.0",
+  "main": "index.js"
+}
diff --git a/packages/playground/nested-deps/vite.config.js b/packages/playground/nested-deps/vite.config.js
index 203f02e001a06c..c58fa180dc06a5 100644
--- a/packages/playground/nested-deps/vite.config.js
+++ b/packages/playground/nested-deps/vite.config.js
@@ -7,7 +7,9 @@ module.exports = {
       'test-package-a',
       'test-package-b',
       'test-package-c',
-      'test-package-c/side'
-    ]
+      'test-package-c/side',
+      'test-package-d/node_modules/test-package-d-nested'
+    ],
+    exclude: ['test-package-d']
   }
 }
diff --git a/yarn.lock b/yarn.lock
index c9e69d52615595..d14907445dbfb1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7383,6 +7383,14 @@ test-exclude@^6.0.0:
   version "0.0.0"
   uid ""
 
+"test-package-d-nested@link:./packages/playground/nested-deps/test-package-d/test-package-d-nested":
+  version "0.0.0"
+  uid ""
+
+"test-package-d@link:./packages/playground/nested-deps/test-package-d":
+  version "0.0.0"
+  uid ""
+
 text-extensions@^1.0.0:
   version "1.9.0"
   resolved "https://registry.yarnpkg.com/text-extensions/-/text-extensions-1.9.0.tgz#1853e45fee39c945ce6f6c36b2d659b5aabc2a26"

From 851c19db4147f0e555efd929bec01e3a504a9844 Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Sun, 15 Aug 2021 20:15:13 +0800
Subject: [PATCH 02/13] feat(optimize): support nested optimization

---
 packages/vite/src/node/plugins/resolve.ts | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/packages/vite/src/node/plugins/resolve.ts b/packages/vite/src/node/plugins/resolve.ts
index c4c25abffbe000..70eec606d92661 100644
--- a/packages/vite/src/node/plugins/resolve.ts
+++ b/packages/vite/src/node/plugins/resolve.ts
@@ -375,8 +375,16 @@ export function tryNodeResolve(
   ssr?: boolean
 ): PartialResolvedId | undefined {
   const { root, dedupe, isBuild } = options
-  const deepMatch = id.match(deepImportRE)
-  const pkgId = deepMatch ? deepMatch[1] || deepMatch[2] : id
+
+  // split id by "node_modules" to get actual nested package name
+  const nodeModulesMatch = id.match(/(.+)\/node_modules\/(.+)/)
+  const nestedRoot = nodeModulesMatch ? nodeModulesMatch[1] : ''
+  const nestedPath = nodeModulesMatch ? nodeModulesMatch[2] : id
+
+  // check for deep import, e.g. "my-lib/foo"
+  const deepMatch = nestedPath.match(deepImportRE)
+
+  const pkgId = deepMatch ? deepMatch[1] || deepMatch[2] : nestedPath
 
   let basedir: string
   if (dedupe && dedupe.includes(pkgId)) {
@@ -386,9 +394,9 @@ export function tryNodeResolve(
     path.isAbsolute(importer) &&
     fs.existsSync(cleanUrl(importer))
   ) {
-    basedir = path.dirname(importer)
+    basedir = path.join(path.dirname(importer), nestedRoot)
   } else {
-    basedir = root
+    basedir = path.join(root, nestedRoot)
   }
 
   const pkg = resolvePackageData(pkgId, basedir)

From 5258e4c74b16bfebb9d6029f5938b99a96834a76 Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Sun, 15 Aug 2021 21:22:48 +0800
Subject: [PATCH 03/13] feat: flat id for node_modules

---
 packages/vite/src/node/utils.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts
index 305e08ce37796a..1ec87caec70154 100644
--- a/packages/vite/src/node/utils.ts
+++ b/packages/vite/src/node/utils.ts
@@ -24,7 +24,8 @@ export function unwrapId(id: string): string {
   return id.startsWith(VALID_ID_PREFIX) ? id.slice(VALID_ID_PREFIX.length) : id
 }
 
-export const flattenId = (id: string): string => id.replace(/[\/\.]/g, '_')
+export const flattenId = (id: string): string =>
+  id.replace(/\/node_modules\//g, '__').replace(/[\/\.]/g, '_')
 
 export function isBuiltin(id: string): boolean {
   return builtins.includes(id)

From efb3ac8ec3b1d7bc3cb8d78fdaf50ef9e3aae317 Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Sun, 15 Aug 2021 22:38:12 +0800
Subject: [PATCH 04/13] feat(resolve): resolve nested optimized deps

---
 packages/vite/src/node/plugins/preAlias.ts |  4 +-
 packages/vite/src/node/plugins/resolve.ts  | 47 +++++++++++++++++++---
 2 files changed, 44 insertions(+), 7 deletions(-)

diff --git a/packages/vite/src/node/plugins/preAlias.ts b/packages/vite/src/node/plugins/preAlias.ts
index 3bd14626e407d7..03337ecf19b60b 100644
--- a/packages/vite/src/node/plugins/preAlias.ts
+++ b/packages/vite/src/node/plugins/preAlias.ts
@@ -13,9 +13,9 @@ export function preAliasPlugin(): Plugin {
     configureServer(_server) {
       server = _server
     },
-    resolveId(id, _, __, ssr) {
+    resolveId(id, importer, _, ssr) {
       if (!ssr && bareImportRE.test(id)) {
-        return tryOptimizedResolve(id, server)
+        return tryOptimizedResolve(id, server, importer)
       }
     }
   }
diff --git a/packages/vite/src/node/plugins/resolve.ts b/packages/vite/src/node/plugins/resolve.ts
index 70eec606d92661..e32a86d6d5b3b7 100644
--- a/packages/vite/src/node/plugins/resolve.ts
+++ b/packages/vite/src/node/plugins/resolve.ts
@@ -202,7 +202,7 @@ export function resolvePlugin(baseOptions: InternalResolveOptions): Plugin {
           asSrc &&
           server &&
           !ssr &&
-          (res = tryOptimizedResolve(id, server))
+          (res = tryOptimizedResolve(id, server, importer))
         ) {
           return res
         }
@@ -459,20 +459,57 @@ export function tryNodeResolve(
 
 export function tryOptimizedResolve(
   id: string,
-  server: ViteDevServer
+  server: ViteDevServer,
+  importer?: string
 ): string | undefined {
   const cacheDir = server.config.cacheDir
   const depData = server._optimizeDepsMetadata
   if (cacheDir && depData) {
     const isOptimized = depData.optimized[id]
-    if (isOptimized) {
+
+    const getOptimizedUrl = (
+      optimizedEntry: typeof depData.optimized[string]
+    ) => {
       return (
-        isOptimized.file +
+        optimizedEntry.file +
         `?v=${depData.browserHash}${
-          isOptimized.needsInterop ? `&es-interop` : ``
+          optimizedEntry.needsInterop ? `&es-interop` : ``
         }`
       )
     }
+
+    // check if id has been optimized
+    if (isOptimized) {
+      return getOptimizedUrl(isOptimized)
+    }
+
+    // if has importer, further check if id is importing from nested depedency
+    if (importer) {
+      let resolvedSrc: string | undefined
+      for (const [k, v] of Object.entries(depData.optimized)) {
+        // check for scenarios, e.g.
+        //   k  => "my-lib/node_modules/foo"
+        //   id => "foo"
+        // this narrows the need to do a full resolve
+        if (k.endsWith(id)) {
+          // lazily initialize resolvedSrc
+          if (resolvedSrc == null) {
+            try {
+              // this may throw errors if unable to resolve, e.g. aliased id
+              resolvedSrc = resolveFrom(id, path.dirname(importer))
+            } catch {
+              // this is best-effort only so swallow errors
+              break
+            }
+          }
+
+          // match by src path, return url similar as above
+          if (v.src === resolvedSrc) {
+            return getOptimizedUrl(v)
+          }
+        }
+      }
+    }
   }
 }
 

From 89d4a298966a9c034b7aa9ea080862f7cce8d3c9 Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Sun, 15 Aug 2021 23:31:44 +0800
Subject: [PATCH 05/13] fix(resolve): actually resolve nested node_modules

---
 packages/vite/src/node/plugins/resolve.ts | 12 +++++++++---
 packages/vite/src/node/utils.ts           | 13 +++++++++++++
 2 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/packages/vite/src/node/plugins/resolve.ts b/packages/vite/src/node/plugins/resolve.ts
index e32a86d6d5b3b7..c1e501119f5b91 100644
--- a/packages/vite/src/node/plugins/resolve.ts
+++ b/packages/vite/src/node/plugins/resolve.ts
@@ -23,7 +23,8 @@ import {
   resolveFrom,
   isDataUrl,
   cleanUrl,
-  slash
+  slash,
+  nestedResolveFrom
 } from '../utils'
 import { ViteDevServer, SSRTarget } from '..'
 import { createFilter } from '@rollup/pluginutils'
@@ -394,9 +395,14 @@ export function tryNodeResolve(
     path.isAbsolute(importer) &&
     fs.existsSync(cleanUrl(importer))
   ) {
-    basedir = path.join(path.dirname(importer), nestedRoot)
+    basedir = path.dirname(importer)
   } else {
-    basedir = path.join(root, nestedRoot)
+    basedir = root
+  }
+
+  // nested node module, step-by-step resolve to the basedir of the nestedPath
+  if (nodeModulesMatch) {
+    basedir = nestedResolveFrom(nestedRoot, basedir)
   }
 
   const pkg = resolvePackageData(pkgId, basedir)
diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts
index 1ec87caec70154..830ca6993c3a3f 100644
--- a/packages/vite/src/node/utils.ts
+++ b/packages/vite/src/node/utils.ts
@@ -50,6 +50,19 @@ export function resolveFrom(id: string, basedir: string, ssr = false): string {
   })
 }
 
+/**
+ * Like `resolveFrom` but supports resolving `node_modules` path in `id`
+ */
+export function nestedResolveFrom(id: string, basedir: string): string {
+  const pkgs = id.split('/node_modules/')
+  try {
+    for (const pkg of pkgs) {
+      basedir = resolveFrom(pkg, basedir)
+    }
+  } catch {}
+  return basedir
+}
+
 // set in bin/vite.js
 const filter = process.env.VITE_DEBUG_FILTER
 

From bd9c2c6346b4892c21c95760219b8c3b7042f37d Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Sun, 15 Aug 2021 23:34:18 +0800
Subject: [PATCH 06/13] chore: format

---
 packages/vite/src/node/utils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts
index 830ca6993c3a3f..3343c192d93f73 100644
--- a/packages/vite/src/node/utils.ts
+++ b/packages/vite/src/node/utils.ts
@@ -51,7 +51,7 @@ export function resolveFrom(id: string, basedir: string, ssr = false): string {
 }
 
 /**
- * Like `resolveFrom` but supports resolving `node_modules` path in `id`
+ * like `resolveFrom` but supports resolving `node_modules` path in `id`
  */
 export function nestedResolveFrom(id: string, basedir: string): string {
   const pkgs = id.split('/node_modules/')

From 85a0a54eb40ac7520f45dd5d70daef5f7a4b84e1 Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Mon, 16 Aug 2021 13:34:44 +0800
Subject: [PATCH 07/13] feat: add nested deps test

---
 packages/playground/nested-deps/__tests__/nested-deps.spec.ts   | 2 ++
 .../nested-deps/test-package-d/test-package-d-nested/index.js   | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/playground/nested-deps/__tests__/nested-deps.spec.ts b/packages/playground/nested-deps/__tests__/nested-deps.spec.ts
index 69f80bbcf4c6eb..dac548d0e4193e 100644
--- a/packages/playground/nested-deps/__tests__/nested-deps.spec.ts
+++ b/packages/playground/nested-deps/__tests__/nested-deps.spec.ts
@@ -5,4 +5,6 @@ test('handle nested package', async () => {
   const c = await page.textContent('.c')
   expect(c).toBe('es-C@1.0.0')
   expect(await page.textContent('.side-c')).toBe(c)
+  expect(await page.textContent('.d')).toBe('D@1.0.0')
+  expect(await page.textContent('.nested-d')).toBe('D-nested@1.0.0')
 })
diff --git a/packages/playground/nested-deps/test-package-d/test-package-d-nested/index.js b/packages/playground/nested-deps/test-package-d/test-package-d-nested/index.js
index f5d878046a8ca3..2ecc48beeccd21 100644
--- a/packages/playground/nested-deps/test-package-d/test-package-d-nested/index.js
+++ b/packages/playground/nested-deps/test-package-d/test-package-d-nested/index.js
@@ -1 +1 @@
-export default 'nested-D@1.0.0'
+export default 'D-nested@1.0.0'

From 62b466627adcb324a36f575ccaaf7c0d3a6bb230 Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Tue, 17 Aug 2021 01:11:47 +0800
Subject: [PATCH 08/13] feat: more tests

---
 .../optimize-deps/__tests__/optimize-deps.spec.ts         | 4 ++++
 packages/playground/optimize-deps/index.html              | 6 ++++++
 packages/playground/optimize-deps/nested-exclude/index.js | 3 +++
 .../optimize-deps/nested-exclude/nested-include/index.js  | 2 ++
 .../nested-exclude/nested-include/package.json            | 5 +++++
 .../playground/optimize-deps/nested-exclude/package.json  | 8 ++++++++
 packages/playground/optimize-deps/package.json            | 1 +
 packages/playground/optimize-deps/vite.config.js          | 4 +++-
 yarn.lock                                                 | 8 ++++++++
 9 files changed, 40 insertions(+), 1 deletion(-)
 create mode 100644 packages/playground/optimize-deps/nested-exclude/index.js
 create mode 100644 packages/playground/optimize-deps/nested-exclude/nested-include/index.js
 create mode 100644 packages/playground/optimize-deps/nested-exclude/nested-include/package.json
 create mode 100644 packages/playground/optimize-deps/nested-exclude/package.json

diff --git a/packages/playground/optimize-deps/__tests__/optimize-deps.spec.ts b/packages/playground/optimize-deps/__tests__/optimize-deps.spec.ts
index 0a37ffc9df36be..947c741e9007b3 100644
--- a/packages/playground/optimize-deps/__tests__/optimize-deps.spec.ts
+++ b/packages/playground/optimize-deps/__tests__/optimize-deps.spec.ts
@@ -71,3 +71,7 @@ test('esbuild-plugin', async () => {
 test('import from hidden dir', async () => {
   expect(await page.textContent('.hidden-dir')).toBe('hello!')
 })
+
+test('import optimize-excluded package that imports optimized-included package', async () => {
+  expect(await page.textContent('.nested-include')).toBe('nested-include')
+})
diff --git a/packages/playground/optimize-deps/index.html b/packages/playground/optimize-deps/index.html
index dc0345e6a6f482..6234be99be08ac 100644
--- a/packages/playground/optimize-deps/index.html
+++ b/packages/playground/optimize-deps/index.html
@@ -46,6 +46,9 @@ <h2>Dep with changes from esbuild plugin</h2>
 <h2>Dep from hidden dir</h2>
 <div>This should show hello!: <span class="hidden-dir"></span></div>
 
+<h2>Nested include</h2>
+<div>Module path: <span class="nested-include"></span></div>
+
 <script type="module">
   // test dep detection in globbed files
   const globbed = import.meta.globEager('./glob/*.js')
@@ -75,6 +78,9 @@ <h2>Dep from hidden dir</h2>
   import { greeting } from './.hidden-dir/foo.js'
   text('.hidden-dir', greeting)
 
+  import { nestedInclude } from 'nested-exclude'
+  text('.nested-include', nestedInclude)
+
   function text(el, text) {
     document.querySelector(el).textContent = text
   }
diff --git a/packages/playground/optimize-deps/nested-exclude/index.js b/packages/playground/optimize-deps/nested-exclude/index.js
new file mode 100644
index 00000000000000..3910458ef4d26d
--- /dev/null
+++ b/packages/playground/optimize-deps/nested-exclude/index.js
@@ -0,0 +1,3 @@
+export { default as nestedInclude } from 'nested-include'
+
+export default 'nested-exclude'
diff --git a/packages/playground/optimize-deps/nested-exclude/nested-include/index.js b/packages/playground/optimize-deps/nested-exclude/nested-include/index.js
new file mode 100644
index 00000000000000..547417fcf2e4d4
--- /dev/null
+++ b/packages/playground/optimize-deps/nested-exclude/nested-include/index.js
@@ -0,0 +1,2 @@
+// written in cjs, optimization should convert this to esm
+module.exports = 'nested-include'
diff --git a/packages/playground/optimize-deps/nested-exclude/nested-include/package.json b/packages/playground/optimize-deps/nested-exclude/nested-include/package.json
new file mode 100644
index 00000000000000..10c83e498f1984
--- /dev/null
+++ b/packages/playground/optimize-deps/nested-exclude/nested-include/package.json
@@ -0,0 +1,5 @@
+{
+  "name": "nested-include",
+  "version": "1.0.0",
+  "main": "index.js"
+}
diff --git a/packages/playground/optimize-deps/nested-exclude/package.json b/packages/playground/optimize-deps/nested-exclude/package.json
new file mode 100644
index 00000000000000..11161cc303af6c
--- /dev/null
+++ b/packages/playground/optimize-deps/nested-exclude/package.json
@@ -0,0 +1,8 @@
+{
+  "name": "nested-exclude",
+  "version": "1.0.0",
+  "main": "index.js",
+  "dependencies": {
+    "nested-include": "link:./nested-include"
+  }
+}
diff --git a/packages/playground/optimize-deps/package.json b/packages/playground/optimize-deps/package.json
index a9644619d74994..033319eaa89fdd 100644
--- a/packages/playground/optimize-deps/package.json
+++ b/packages/playground/optimize-deps/package.json
@@ -15,6 +15,7 @@
     "dep-linked": "link:./dep-linked",
     "dep-linked-include": "link:./dep-linked-include",
     "dep-esbuild-plugin-transform": "link:./dep-esbuild-plugin-transform",
+    "nested-exclude": "link:./nested-exclude",
     "phoenix": "^1.5.7",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
diff --git a/packages/playground/optimize-deps/vite.config.js b/packages/playground/optimize-deps/vite.config.js
index ff9f95c92f808c..45a8d44db96487 100644
--- a/packages/playground/optimize-deps/vite.config.js
+++ b/packages/playground/optimize-deps/vite.config.js
@@ -12,8 +12,10 @@ module.exports = {
     include: [
       'dep-linked-include',
       // required since it isn't in node_modules and is ignored by the optimizer otherwise
-      'dep-esbuild-plugin-transform'
+      'dep-esbuild-plugin-transform',
+      'nested-exclude/node_modules/nested-include'
     ],
+    exclude: ['nested-exclude'],
     esbuildOptions: {
       plugins: [
         {
diff --git a/yarn.lock b/yarn.lock
index d14907445dbfb1..e8c2da31be6522 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5456,6 +5456,14 @@ neo-async@^2.6.0:
   resolved "https://registry.yarnpkg.com/neo-async/-/neo-async-2.6.2.tgz#b4aafb93e3aeb2d8174ca53cf163ab7d7308305f"
   integrity sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==
 
+"nested-exclude@link:./packages/playground/optimize-deps/nested-exclude":
+  version "0.0.0"
+  uid ""
+
+"nested-include@link:./packages/playground/optimize-deps/nested-exclude/nested-include":
+  version "0.0.0"
+  uid ""
+
 nice-try@^1.0.4:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/nice-try/-/nice-try-1.0.5.tgz#a3378a7696ce7d223e88fc9b764bd7ef1089e366"

From 7c7c8b51c9038771e720c0b0a7e88d5ec482e044 Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Tue, 17 Aug 2021 14:50:50 +0800
Subject: [PATCH 09/13] fix: install nested-include as file

---
 .../playground/optimize-deps/nested-exclude/package.json     | 2 +-
 yarn.lock                                                    | 5 ++---
 2 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/packages/playground/optimize-deps/nested-exclude/package.json b/packages/playground/optimize-deps/nested-exclude/package.json
index 11161cc303af6c..7a0d1f571ad7fb 100644
--- a/packages/playground/optimize-deps/nested-exclude/package.json
+++ b/packages/playground/optimize-deps/nested-exclude/package.json
@@ -3,6 +3,6 @@
   "version": "1.0.0",
   "main": "index.js",
   "dependencies": {
-    "nested-include": "link:./nested-include"
+    "nested-include": "file:./nested-include"
   }
 }
diff --git a/yarn.lock b/yarn.lock
index 1f801bae492b39..895f434bf89ecb 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5429,9 +5429,8 @@ neo-async@^2.6.0:
   version "0.0.0"
   uid ""
 
-"nested-include@link:./packages/playground/optimize-deps/nested-exclude/nested-include":
-  version "0.0.0"
-  uid ""
+"nested-include@file:./packages/playground/optimize-deps/nested-exclude/nested-include":
+  version "1.0.0"
 
 nice-try@^1.0.4:
   version "1.0.5"

From f1ad29acd3372c4960bae276fe8477da65a945a0 Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Wed, 18 Aug 2021 01:04:44 +0800
Subject: [PATCH 10/13] refactor(resolve): flatten optimized resolve

---
 packages/vite/src/node/plugins/resolve.ts | 81 +++++++++++------------
 1 file changed, 40 insertions(+), 41 deletions(-)

diff --git a/packages/vite/src/node/plugins/resolve.ts b/packages/vite/src/node/plugins/resolve.ts
index 60654425ec6197..8b9baf149c3d12 100644
--- a/packages/vite/src/node/plugins/resolve.ts
+++ b/packages/vite/src/node/plugins/resolve.ts
@@ -484,52 +484,51 @@ export function tryOptimizedResolve(
 ): string | undefined {
   const cacheDir = server.config.cacheDir
   const depData = server._optimizeDepsMetadata
-  if (cacheDir && depData) {
-    const isOptimized = depData.optimized[id]
-
-    const getOptimizedUrl = (
-      optimizedEntry: typeof depData.optimized[string]
-    ) => {
-      return (
-        optimizedEntry.file +
-        `?v=${depData.browserHash}${
-          optimizedEntry.needsInterop ? `&es-interop` : ``
-        }`
-      )
-    }
 
-    // check if id has been optimized
-    if (isOptimized) {
-      return getOptimizedUrl(isOptimized)
-    }
+  if (!cacheDir || !depData) return
 
-    // if has importer, further check if id is importing from nested depedency
-    if (importer) {
-      let resolvedSrc: string | undefined
-      for (const [k, v] of Object.entries(depData.optimized)) {
-        // check for scenarios, e.g.
-        //   k  => "my-lib/node_modules/foo"
-        //   id => "foo"
-        // this narrows the need to do a full resolve
-        if (k.endsWith(id)) {
-          // lazily initialize resolvedSrc
-          if (resolvedSrc == null) {
-            try {
-              // this may throw errors if unable to resolve, e.g. aliased id
-              resolvedSrc = resolveFrom(id, path.dirname(importer))
-            } catch {
-              // this is best-effort only so swallow errors
-              break
-            }
-          }
+  const getOptimizedUrl = (optimizedData: typeof depData.optimized[string]) => {
+    return (
+      optimizedData.file +
+      `?v=${depData.browserHash}${
+        optimizedData.needsInterop ? `&es-interop` : ``
+      }`
+    )
+  }
 
-          // match by src path, return url similar as above
-          if (v.src === resolvedSrc) {
-            return getOptimizedUrl(v)
-          }
-        }
+  // check if id has been optimized
+  const isOptimized = depData.optimized[id]
+  if (isOptimized) {
+    return getOptimizedUrl(isOptimized)
+  }
+
+  if (!importer) return
+
+  // further check if id is imported by nested dependency
+  let resolvedSrc: string | undefined
+
+  for (const [pkgPath, optimizedData] of Object.entries(depData.optimized)) {
+    // check for scenarios, e.g.
+    //   pkgPath  => "my-lib/node_modules/foo"
+    //   id       => "foo"
+    // this narrows the need to do a full resolve
+    if (!pkgPath.endsWith(id)) continue
+
+    // lazily initialize resolvedSrc
+    if (resolvedSrc == null) {
+      try {
+        // this may throw errors if unable to resolve, e.g. aliased id
+        resolvedSrc = resolveFrom(id, path.dirname(importer))
+      } catch {
+        // this is best-effort only so swallow errors
+        break
       }
     }
+
+    // match by src to correctly identify if id belongs to nested dependency
+    if (optimizedData.src === resolvedSrc) {
+      return getOptimizedUrl(optimizedData)
+    }
   }
 }
 

From d6db5773bcb996ce6c4788311933151f0a3c49bc Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Wed, 18 Aug 2021 11:14:01 +0800
Subject: [PATCH 11/13] docs: add note on nested optimization

---
 docs/config/index.md | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/docs/config/index.md b/docs/config/index.md
index e7043a5145cc30..e3e78437f0aa2e 100644
--- a/docs/config/index.md
+++ b/docs/config/index.md
@@ -707,7 +707,16 @@ createServer()
   Dependencies to exclude from pre-bundling.
 
   :::warning CommonJS
-  CommonJS dependencies should not be excluded from optimization. If an ESM dependency has a nested CommonJS dependency, it should not be excluded as well.
+  CommonJS dependencies should not be excluded from optimization. If an ESM dependency is excluded from optimization, but has a nested CommonJS dependency, the CommonJS dependency should be added to `optimizeDeps.include`. Example:
+
+  ```js
+  export default defineConfig({
+    optimizeDeps: {
+      include: ['esm-dep/node_modules/cjs-dep']
+    }
+  })
+  ```
+
   :::
 
 ### optimizeDeps.include

From cb728fdd4855f94592aa3554b5910f67925936e6 Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Sat, 28 Aug 2021 14:40:51 +0800
Subject: [PATCH 12/13] feat(optimizer): use > instead of node_modules

---
 docs/config/index.md                             |  2 +-
 packages/playground/nested-deps/vite.config.js   |  2 +-
 packages/playground/optimize-deps/vite.config.js |  2 +-
 packages/vite/src/node/optimizer/index.ts        | 10 +++++++---
 packages/vite/src/node/plugins/resolve.ts        | 14 ++++++++------
 packages/vite/src/node/utils.ts                  | 10 +++++++---
 6 files changed, 25 insertions(+), 15 deletions(-)

diff --git a/docs/config/index.md b/docs/config/index.md
index 55dc13f82cbcbf..5cd1a23774400c 100644
--- a/docs/config/index.md
+++ b/docs/config/index.md
@@ -718,7 +718,7 @@ createServer()
   ```js
   export default defineConfig({
     optimizeDeps: {
-      include: ['esm-dep/node_modules/cjs-dep']
+      include: ['esm-dep > cjs-dep']
     }
   })
   ```
diff --git a/packages/playground/nested-deps/vite.config.js b/packages/playground/nested-deps/vite.config.js
index c58fa180dc06a5..cc3bcb2ada226b 100644
--- a/packages/playground/nested-deps/vite.config.js
+++ b/packages/playground/nested-deps/vite.config.js
@@ -8,7 +8,7 @@ module.exports = {
       'test-package-b',
       'test-package-c',
       'test-package-c/side',
-      'test-package-d/node_modules/test-package-d-nested'
+      'test-package-d    > test-package-d-nested'
     ],
     exclude: ['test-package-d']
   }
diff --git a/packages/playground/optimize-deps/vite.config.js b/packages/playground/optimize-deps/vite.config.js
index 45a8d44db96487..94c308a000cfab 100644
--- a/packages/playground/optimize-deps/vite.config.js
+++ b/packages/playground/optimize-deps/vite.config.js
@@ -13,7 +13,7 @@ module.exports = {
       'dep-linked-include',
       // required since it isn't in node_modules and is ignored by the optimizer otherwise
       'dep-esbuild-plugin-transform',
-      'nested-exclude/node_modules/nested-include'
+      'nested-exclude>nested-include'
     ],
     exclude: ['nested-exclude'],
     esbuildOptions: {
diff --git a/packages/vite/src/node/optimizer/index.ts b/packages/vite/src/node/optimizer/index.ts
index 5b899b758ccd33..274f7634dea2ae 100644
--- a/packages/vite/src/node/optimizer/index.ts
+++ b/packages/vite/src/node/optimizer/index.ts
@@ -10,7 +10,8 @@ import {
   lookupFile,
   normalizePath,
   writeFile,
-  flattenId
+  flattenId,
+  normalizeId
 } from '../utils'
 import { esbuildDepPlugin } from './esbuildDepPlugin'
 import { ImportSpecifier, init, parse } from 'es-module-lexer'
@@ -184,10 +185,13 @@ export async function optimizeDeps(
   if (include) {
     const resolve = config.createResolver({ asSrc: false })
     for (const id of include) {
-      if (!deps[id]) {
+      // normalize 'foo   >bar` as 'foo > bar' to prevent same id being added
+      // and for pretty printing
+      const normalizedId = normalizeId(id)
+      if (!deps[normalizedId]) {
         const entry = await resolve(id)
         if (entry) {
-          deps[id] = entry
+          deps[normalizedId] = entry
         } else {
           throw new Error(
             `Failed to resolve force included dependency: ${chalk.cyan(id)}`
diff --git a/packages/vite/src/node/plugins/resolve.ts b/packages/vite/src/node/plugins/resolve.ts
index 8b9baf149c3d12..8b03d363ad40f4 100644
--- a/packages/vite/src/node/plugins/resolve.ts
+++ b/packages/vite/src/node/plugins/resolve.ts
@@ -391,10 +391,12 @@ export function tryNodeResolve(
 ): PartialResolvedId | undefined {
   const { root, dedupe, isBuild } = options
 
-  // split id by "node_modules" to get actual nested package name
-  const nodeModulesMatch = id.match(/(.+)\/node_modules\/(.+)/)
-  const nestedRoot = nodeModulesMatch ? nodeModulesMatch[1] : ''
-  const nestedPath = nodeModulesMatch ? nodeModulesMatch[2] : id
+  // split id by last '>' for nested selected packages, for example:
+  // 'foo > bar > baz' => 'foo > bar' & 'baz'
+  // 'foo'             => ''          & 'foo'
+  const lastArrowIndex = id.lastIndexOf('>')
+  const nestedRoot = id.substring(0, lastArrowIndex).trim()
+  const nestedPath = id.substring(lastArrowIndex + 1).trim()
 
   // check for deep import, e.g. "my-lib/foo"
   const deepMatch = nestedPath.match(deepImportRE)
@@ -415,7 +417,7 @@ export function tryNodeResolve(
   }
 
   // nested node module, step-by-step resolve to the basedir of the nestedPath
-  if (nodeModulesMatch) {
+  if (nestedRoot) {
     basedir = nestedResolveFrom(nestedRoot, basedir)
   }
 
@@ -509,7 +511,7 @@ export function tryOptimizedResolve(
 
   for (const [pkgPath, optimizedData] of Object.entries(depData.optimized)) {
     // check for scenarios, e.g.
-    //   pkgPath  => "my-lib/node_modules/foo"
+    //   pkgPath  => "my-lib > foo"
     //   id       => "foo"
     // this narrows the need to do a full resolve
     if (!pkgPath.endsWith(id)) continue
diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts
index e436adfaa4eecd..3b4b8c34545913 100644
--- a/packages/vite/src/node/utils.ts
+++ b/packages/vite/src/node/utils.ts
@@ -31,7 +31,10 @@ export function unwrapId(id: string): string {
 }
 
 export const flattenId = (id: string): string =>
-  id.replace(/\/node_modules\//g, '__').replace(/[\/\.]/g, '_')
+  id.replace(/(\s*>\s*)/g, '__').replace(/[\/\.]/g, '_')
+
+export const normalizeId = (id: string): string =>
+  id.replace(/(\s*>\s*)/g, ' > ')
 
 export function isBuiltin(id: string): boolean {
   return builtins.includes(id)
@@ -57,10 +60,11 @@ export function resolveFrom(id: string, basedir: string, ssr = false): string {
 }
 
 /**
- * like `resolveFrom` but supports resolving `node_modules` path in `id`
+ * like `resolveFrom` but supports resolving `>` path in `id`,
+ * for example: `foo > bar > baz`
  */
 export function nestedResolveFrom(id: string, basedir: string): string {
-  const pkgs = id.split('/node_modules/')
+  const pkgs = id.split('>').map((pkg) => pkg.trim())
   try {
     for (const pkg of pkgs) {
       basedir = resolveFrom(pkg, basedir)

From d8e6ca93316f8549bf4ecee7c3a9fb25666bdfbc Mon Sep 17 00:00:00 2001
From: bluwy <bjornlu.dev@gmail.com>
Date: Sat, 28 Aug 2021 15:07:24 +0800
Subject: [PATCH 13/13] chore: remove unrelated merge changes

---
 packages/create-vite/index.js                    | 2 +-
 packages/playground/dynamic-import/css/index.css | 8 ++------
 packages/playground/env/index.html               | 5 +----
 3 files changed, 4 insertions(+), 11 deletions(-)

diff --git a/packages/create-vite/index.js b/packages/create-vite/index.js
index 335a2109d40663..efcf63cb6a8629 100755
--- a/packages/create-vite/index.js
+++ b/packages/create-vite/index.js
@@ -3,7 +3,7 @@
 // @ts-check
 const fs = require('fs')
 const path = require('path')
-// Avoids autoconversion to number of the project name by defining that the args
+// Avoids autoconversion to number of the project name by defining that the args 
 // non associated with an option ( _ ) needs to be parsed as a string. See #4606
 const argv = require('minimist')(process.argv.slice(2), { string: ['_'] })
 // eslint-disable-next-line node/no-restricted-require
diff --git a/packages/playground/dynamic-import/css/index.css b/packages/playground/dynamic-import/css/index.css
index b8cb940c65b159..07b64e1de286d0 100644
--- a/packages/playground/dynamic-import/css/index.css
+++ b/packages/playground/dynamic-import/css/index.css
@@ -1,6 +1,2 @@
-.css {
-  box-sizing: border-box;
-}
-.view {
-  color: red;
-}
+.css { box-sizing: border-box; }
+.view { color: red; }
diff --git a/packages/playground/env/index.html b/packages/playground/env/index.html
index 3728b870b1df32..77b3f7da5f5105 100644
--- a/packages/playground/env/index.html
+++ b/packages/playground/env/index.html
@@ -4,10 +4,7 @@ <h1>Environment Variables</h1>
 <p>import.meta.env.DEV: <code class="dev"></code></p>
 <p>import.meta.env.PROD: <code class="prod"></code></p>
 <p>import.meta.env.VITE_CUSTOM_ENV_VARIABLE: <code class="custom"></code></p>
-<p>
-  import.meta.env.CUSTOM_PREFIX_ENV_VARIABLE:
-  <code class="custom-prefix"></code>
-</p>
+<p>import.meta.env.CUSTOM_PREFIX_ENV_VARIABLE: <code class="custom-prefix"></code></p>
 <p>
   import.meta.env.VITE_EFFECTIVE_MODE_FILE_NAME: <code class="mode-file"></code>
 </p>