chore: use empty string

vitejs · Apr 12, 2022 · f2dd1cb · f2dd1cb
1 parent 9d66c1e
commit f2dd1cb
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 14 deletions.
diff --git a/packages/playground/assets/__tests__/assets.spec.ts b/packages/playground/assets/__tests__/assets.spec.ts
@@ -307,3 +307,10 @@ if (!isBuild) {
     await untilUpdated(() => getColor('.import-css'), 'rgb(0, 255, 136)')
   })
 }
+
+test('html import word boundary', async () => {
+  expect(await page.textContent('.obj-import-express')).toMatch(
+    'ignore object import prop'
+  )
+  expect(await page.textContent('.string-import-express')).toMatch('no load')
+})
diff --git a/packages/playground/assets/index.html b/packages/playground/assets/index.html
@@ -184,7 +184,7 @@ <h2>simple script tag import-expression</h2>
       text('.obj-import-express', t)
     }
   }
-  const stringImport = "import('package')"
+  const stringImport = "const t = import('package')"
   function text(el, text) {
     document.querySelector(el).textContent = text
   }
@@ -193,7 +193,11 @@ <h2>simple script tag import-expression</h2>
   // import('./static/raw.js')
   /* import('./static/raw.js') */
   obj.import('ignore object import prop')
-  text('.string-import-express', t)
+  try {
+    text('.string-import-express', t)
+  } catch {
+    text('.string-import-express', 'no load')
+  }
 </script>
 <h2>url in style tag</h2>
 <h3>url</h3>

diff --git a/packages/vite/src/node/plugins/html.ts b/packages/vite/src/node/plugins/html.ts
@@ -37,6 +37,7 @@ import type {
   TextNode
 } from '@vue/compiler-dom'
 import { NodeTypes } from '@vue/compiler-dom'
+import { emptyString } from '../cleanString'
 
 interface ScriptAssetsUrl {
   start: number
@@ -306,24 +307,18 @@ export function buildHtmlPlugin(config: ResolvedConfig): Plugin {
               }
             } else if (node.children.length) {
               const scriptNode = node.children.pop()! as TextNode
-              const code = scriptNode.content
-                .replace(multilineCommentsRE, (m) => ' '.repeat(m.length))
-                .replace(singlelineCommentsRE, (m) => ' '.repeat(m.length))
-                .replace(
-                  /"[^"]*"|'[^']*'|`[^`]*`/g,
-                  (m) => `'${' '.repeat(m.length - 2)}'`
-                )
+              const cleanCode = emptyString(scriptNode.content)
 
               let match: RegExpExecArray | null
-              while ((match = inlineImportRE.exec(code))) {
-                const { 0: full, 1: url, index } = match
-                const startUrl = full.indexOf(url)
-                const start = index + startUrl + 1
+              while ((match = inlineImportRE.exec(cleanCode))) {
+                const { 1: url, index } = match
+                const startUrl = cleanCode.indexOf(url, index)
+                const start = startUrl + 1
                 const end = start + url.length - 2
                 scriptUrls.push({
                   start: start + scriptNode.loc.start.offset,
                   end: end + scriptNode.loc.start.offset,
-                  url: scriptNode.content.slice(index + startUrl + 1, end)
+                  url: scriptNode.content.slice(start, end)
                 })
               }
             }