fix(dynamic-import-vars): preserve custom query string (#14459)

vitejs · Oct 17, 2023 · 1f2a982 · 1f2a982
1 parent 96a4ce3
commit 1f2a982
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 12 deletions.
diff --git a/...mportVar/__snapshots__/parse.test.ts.snap → ...mportVar/__snapshots__/parse.spec.ts.snap b/...mportVar/__snapshots__/parse.test.ts.snap → ...mportVar/__snapshots__/parse.spec.ts.snap
@@ -14,6 +14,8 @@ exports[`parse positives > with ../ and itself 1`] = `"__variableDynamicImportRu
 
 exports[`parse positives > with multi ../ and itself 1`] = `"__variableDynamicImportRuntimeHelper((import.meta.glob(\\"../../plugins/dynamicImportVar/*.js\\")), \`./\${name}.js\`)"`;
 
+exports[`parse positives > with query 1`] = `"__variableDynamicImportRuntimeHelper((import.meta.glob(\\"./mods/*.js\\", {\\"query\\":{\\"foo\\":\\"bar\\"}})), \`./mods/\${base}.js\`)"`;
+
 exports[`parse positives > with query raw 1`] = `"__variableDynamicImportRuntimeHelper((import.meta.glob(\\"./mods/*.js\\", {\\"as\\":\\"raw\\",\\"import\\":\\"*\\"})), \`./mods/\${base}.js\`)"`;
 
 exports[`parse positives > with query url 1`] = `"__variableDynamicImportRuntimeHelper((import.meta.glob(\\"./mods/*.js\\", {\\"as\\":\\"url\\",\\"import\\":\\"*\\"})), \`./mods/\${base}.js\`)"`;
diff --git a/...__/plugins/dynamicImportVar/parse.test.ts → ...__/plugins/dynamicImportVar/parse.spec.ts b/...__/plugins/dynamicImportVar/parse.test.ts → ...__/plugins/dynamicImportVar/parse.spec.ts
@@ -26,6 +26,10 @@ describe('parse positives', () => {
     expect(await run('`@/${base}.js`')).toMatchSnapshot()
   })
 
+  it('with query', async () => {
+    expect(await run('`./mods/${base}.js?foo=bar`')).toMatchSnapshot()
+  })
+
   it('with query raw', async () => {
     expect(await run('`./mods/${base}.js?raw`')).toMatchSnapshot()
   })

diff --git a/packages/vite/src/node/plugins/dynamicImportVars.ts b/packages/vite/src/node/plugins/dynamicImportVars.ts
@@ -29,6 +29,8 @@ const hasDynamicImportRE = /\bimport\s*[(/]/
 
 interface DynamicImportRequest {
   as?: keyof KnownAsTypeMap
+  query?: Record<string, string>
+  import?: string
 }
 
 interface DynamicImportPattern {
@@ -55,6 +57,7 @@ function parseDynamicImportPattern(
   const filename = strings.slice(1, -1)
   const rawQuery = parseRequest(filename)
   let globParams: DynamicImportRequest | null = null
+
   const ast = (
     parseJS(strings, {
       ecmaVersion: 'latest',
@@ -70,16 +73,19 @@ function parseDynamicImportPattern(
   const [userPattern] = userPatternQuery.split(requestQuerySplitRE, 2)
   const [rawPattern] = filename.split(requestQuerySplitRE, 2)
 
-  if (rawQuery?.raw !== undefined) {
-    globParams = { as: 'raw' }
-  }
-
-  if (rawQuery?.url !== undefined) {
-    globParams = { as: 'url' }
-  }
+  const as = (['worker', 'url', 'raw'] as const).find(
+    (key) => rawQuery && key in rawQuery,
+  )
 
-  if (rawQuery?.worker !== undefined) {
-    globParams = { as: 'worker' }
+  if (as) {
+    globParams = {
+      as,
+      import: '*',
+    }
+  } else if (rawQuery) {
+    globParams = {
+      query: rawQuery,
+    }
   }
 
   return {
@@ -121,9 +127,7 @@ export async function transformDynamicImport(
     return null
   }
   const { globParams, rawPattern, userPattern } = dynamicImportPattern
-  const params = globParams
-    ? `, ${JSON.stringify({ ...globParams, import: '*' })}`
-    : ''
+  const params = globParams ? `, ${JSON.stringify(globParams)}` : ''
 
   let newRawPattern = posix.relative(
     posix.dirname(importer),