fix: dynamic-import-vars plugin normalize path issue (#16518)

Author: godky

packages/vite/src/node/__tests__/plugins/dynamicImportVar/__snapshots__/parse.spec.ts.snap

@@ -8,6 +8,8 @@ exports[`parse positives > ? in worker 1`] = `"__variableDynamicImportRuntimeHel
 
 exports[`parse positives > alias path 1`] = `"__variableDynamicImportRuntimeHelper((import.meta.glob("./mods/*.js")), \`./mods/\${base}.js\`)"`;
 
+exports[`parse positives > alias path with multi ../ 1`] = `"__variableDynamicImportRuntimeHelper((import.meta.glob("../../*.js")), \`../../\${base}.js\`)"`;
+
 exports[`parse positives > basic 1`] = `"__variableDynamicImportRuntimeHelper((import.meta.glob("./mods/*.js")), \`./mods/\${base}.js\`)"`;
 
 exports[`parse positives > with ../ and itself 1`] = `"__variableDynamicImportRuntimeHelper((import.meta.glob("../dynamicImportVar/*.js")), \`./\${name}.js\`)"`;

packages/vite/src/node/__tests__/plugins/dynamicImportVar/parse.spec.ts

@@ -12,7 +12,10 @@ async function run(input: string) {
     (await transformDynamicImport(
       input,
       normalizePath(resolve(__dirname, 'index.js')),
-      (id) => id.replace('@', resolve(__dirname, './mods/')),
+      (id) =>
+        id
+          .replace('@', resolve(__dirname, './mods/'))
+          .replace('#', resolve(__dirname, '../../')),
       __dirname,
     )) || {}
   return `__variableDynamicImportRuntimeHelper(${glob}, \`${rawPattern}\`)`
@@ -27,6 +30,10 @@ describe('parse positives', () => {
     expect(await run('`@/${base}.js`')).toMatchSnapshot()
   })
 
+  it('alias path with multi ../', async () => {
+    expect(await run('`#/${base}.js`')).toMatchSnapshot()
+  })
+
   it('with query', async () => {
     expect(await run('`./mods/${base}.js?foo=bar`')).toMatchSnapshot()
   })

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

@@ -117,13 +117,14 @@ export async function transformDynamicImport(
     if (!resolvedFileName) {
       return null
     }
-    const relativeFileName = posix.relative(
-      posix.dirname(normalizePath(importer)),
-      normalizePath(resolvedFileName),
-    )
-    importSource = normalizePath(
-      '`' + (relativeFileName[0] === '.' ? '' : './') + relativeFileName + '`',
+    const relativeFileName = normalizePath(
+      posix.relative(
+        posix.dirname(normalizePath(importer)),
+        normalizePath(resolvedFileName),
+      ),
     )
+    importSource =
+      '`' + (relativeFileName[0] === '.' ? '' : './') + relativeFileName + '`'
   }
 
   const dynamicImportPattern = parseDynamicImportPattern(importSource)