fix(analysis): warnings for dynamic imports that use static template …

…literals (#14458) Co-authored-by: 翠 / green <green@sapphi.red>
vitejs · Oct 3, 2023 · 0c6d289 · 0c6d289
1 parent 269aa43
commit 0c6d289
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 3 deletions.
diff --git a/packages/vite/src/node/plugins/importAnalysis.ts b/packages/vite/src/node/plugins/importAnalysis.ts
@@ -82,6 +82,8 @@ export const hasViteIgnoreRE = /\/\*\s*@vite-ignore\s*\*\//
 const cleanUpRawUrlRE = /\/\*[\s\S]*?\*\/|([^\\:]|^)\/\/.*$/gm
 const urlIsStringRE = /^(?:'.*'|".*"|`.*`)$/
 
+const templateLiteralRE = /^\s*`(.*)`\s*$/
+
 interface UrlPosition {
   url: string
   start: number
@@ -426,12 +428,13 @@ export function importAnalysisPlugin(config: ResolvedConfig): Plugin {
             ss: expStart,
             se: expEnd,
             d: dynamicIndex,
-            // #2083 User may use escape path,
-            // so use imports[index].n to get the unescaped string
-            n: specifier,
             a: assertIndex,
           } = importSpecifier
 
+          // #2083 User may use escape path,
+          // so use imports[index].n to get the unescaped string
+          let specifier = importSpecifier.n
+
           const rawUrl = source.slice(start, end)
 
           // check import.meta usage
@@ -469,6 +472,14 @@ export function importAnalysisPlugin(config: ResolvedConfig): Plugin {
               hasEnv = true
             }
             return
+          } else if (templateLiteralRE.test(rawUrl)) {
+            // If the import has backticks but isn't transformed as a glob import
+            // (as there's nothing to glob), check if it's simply a plain string.
+            // If so, we can replace the specifier as a plain string to prevent
+            // an incorrect "cannot be analyzed" warning.
+            if (!(rawUrl.includes('${') && rawUrl.includes('}'))) {
+              specifier = rawUrl.replace(templateLiteralRE, '$1')
+            }
           }
 
           const isDynamicImport = dynamicIndex > -1

diff --git a/playground/dynamic-import/index.html b/playground/dynamic-import/index.html
@@ -35,6 +35,8 @@
 
 <div class="dynamic-import-self"></div>
 
+<div class="dynamic-import-static"></div>
+
 <div class="dynamic-import-nested-self"></div>
 
 <script type="module" src="./nested/index.js"></script>

diff --git a/playground/dynamic-import/nested/index.js b/playground/dynamic-import/nested/index.js
@@ -131,4 +131,8 @@ import(`../nested/nested/${base}.js`).then((mod) => {
   text('.dynamic-import-nested-self', mod.self)
 })
 
+import(`../nested/static.js`).then((mod) => {
+  text('.dynamic-import-static', mod.self)
+})
+
 console.log('index.js')
diff --git a/playground/dynamic-import/nested/static.js b/playground/dynamic-import/nested/static.js
@@ -0,0 +1 @@
+export const self = 'dynamic-import-static'