fix(resolve): rebase sub imports relative path (#12373)

packages/vite/src/node/plugins/resolve.ts

@@ -161,13 +161,26 @@ export function resolvePlugin(resolveOptions: InternalResolveOptions): Plugin {
         if (!pkgJsonPath) return
 
         const pkgData = loadPackageData(pkgJsonPath, options.preserveSymlinks)
-        return resolveExportsOrImports(
+        let importsPath = resolveExportsOrImports(
           pkgData.data,
           id,
           options,
           targetWeb,
           'imports',
         )
+
+        if (importsPath?.startsWith('.')) {
+          importsPath = path.relative(
+            basedir,
+            path.join(path.dirname(pkgJsonPath), importsPath),
+          )
+
+          if (!importsPath.startsWith('.')) {
+            importsPath = `./${importsPath}`
+          }
+        }
+
+        return importsPath
       }
 
       const resolvedImports = resolveSubpathImports(id, importer)

playground/resolve/__tests__/resolve.spec.ts

@@ -163,6 +163,12 @@ test('Resolving top level with imports field', async () => {
   expect(await page.textContent('.imports-top-level')).toMatch('[success]')
 })
 
+test('Resolving same level with imports field', async () => {
+  expect(await page.textContent('.imports-same-level')).toMatch(
+    await page.textContent('.imports-top-level'),
+  )
+})
+
 test('Resolving nested path with imports field', async () => {
   expect(await page.textContent('.imports-nested')).toMatch('[success]')
 })

playground/resolve/imports-path/same-level.js

@@ -0,0 +1 @@
+export * from '#top-level'

playground/resolve/index.html

@@ -39,6 +39,9 @@ <h2>Exports with module</h2>
 <h2>Resolving top level with imports field</h2>
 <p class="imports-top-level">fail</p>
 
+<h2>Resolving same level with imports field</h2>
+<p class="imports-same-level">fail</p>
+
 <h2>Resolving nested path with imports field</h2>
 <p class="imports-nested">fail</p>
 
@@ -206,6 +209,9 @@ <h2>resolve package that contains # in path</h2>
   import { msg as importsTopLevel } from '#top-level'
   text('.imports-top-level', importsTopLevel)
 
+  import { msg as importsSameLevel } from '#same-level'
+  text('.imports-same-level', importsSameLevel)
+
   import { msg as importsNested } from '#nested/path.js'
   text('.imports-nested', importsNested)
 

playground/resolve/package.json

@@ -10,6 +10,7 @@
   },
   "imports": {
     "#top-level": "./imports-path/top-level.js",
+    "#same-level": "./imports-path/same-level.js",
     "#nested/path.js": "./imports-path/nested-path.js",
     "#star/*": "./imports-path/star/*",
     "#slash/": "./imports-path/slash/",