fix: don't transform new URL(url, import.meta.url) in comments (#4732)

vitejs · Aug 30, 2021 · bf0b631 · bf0b631
1 parent 2cbf3f3
commit bf0b631
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 12 deletions.
diff --git a/packages/playground/assets/index.html b/packages/playground/assets/index.html
@@ -168,9 +168,14 @@ <h2>new URL(`./${dynamic}`, import.meta.url)</h2>
   import unicodeUrl from './テスト-測試-white space.js?url'
   text('.unicode-url', unicodeUrl)
 
+  // const url = new URL('non_existent_file.png', import.meta.url)
   const metaUrl = new URL('./nested/asset.png', import.meta.url)
   text('.import-meta-url', metaUrl)
   document.querySelector('.import-meta-url-img').src = metaUrl
+  /**
+   * don't process the code in the comment
+   * const url = new URL('non_existent_file.png', import.meta.url)
+   */
 
   function testDynamicImportMetaUrl(name, i) {
     const metaUrl = new URL(`./nested/${name}.png`, import.meta.url)

diff --git a/packages/vite/src/node/__tests__/scan.spec.ts b/packages/vite/src/node/__tests__/scan.spec.ts
@@ -1,10 +1,5 @@
-import {
-  scriptRE,
-  commentRE,
-  importsRE,
-  multilineCommentsRE,
-  singlelineCommentsRE
-} from '../optimizer/scan'
+import { scriptRE, commentRE, importsRE } from '../optimizer/scan'
+import { multilineCommentsRE, singlelineCommentsRE } from '../utils'
 
 describe('optimizer-scan:script-test', () => {
   const scriptContent = `import { defineComponent } from 'vue'

diff --git a/packages/vite/src/node/optimizer/scan.ts b/packages/vite/src/node/optimizer/scan.ts
@@ -15,7 +15,9 @@ import {
   isObject,
   cleanUrl,
   externalRE,
-  dataUrlRE
+  dataUrlRE,
+  multilineCommentsRE,
+  singlelineCommentsRE
 } from '../utils'
 import {
   createPluginContainer,
@@ -40,9 +42,6 @@ const htmlTypesRE = /\.(html|vue|svelte)$/
 export const importsRE =
   /(?<!\/\/.*)(?<=^|;|\*\/)\s*import(?!\s+type)(?:[\w*{}\n\r\t, ]+from\s*)?\s*("[^"]+"|'[^']+')\s*(?=$|;|\/\/|\/\*)/gm
 
-export const multilineCommentsRE = /\/\*(.|[\r\n])*?\*\//gm
-export const singlelineCommentsRE = /\/\/.*/g
-
 export async function scanImports(config: ResolvedConfig): Promise<{
   deps: Record<string, string>
   missing: Record<string, string>

diff --git a/packages/vite/src/node/plugins/assetImportMetaUrl.ts b/packages/vite/src/node/plugins/assetImportMetaUrl.ts
@@ -3,6 +3,7 @@ import MagicString from 'magic-string'
 import path from 'path'
 import { fileToUrl } from './asset'
 import { ResolvedConfig } from '../config'
+import { multilineCommentsRE, singlelineCommentsRE } from '../utils'
 
 /**
  * Convert `new URL('./foo.png', import.meta.url)` to its resolved built URL
@@ -21,9 +22,12 @@ export function assetImportMetaUrlPlugin(config: ResolvedConfig): Plugin {
       if (code.includes('new URL') && code.includes(`import.meta.url`)) {
         const importMetaUrlRE =
           /\bnew\s+URL\s*\(\s*('[^']+'|"[^"]+"|`[^`]+`)\s*,\s*import\.meta\.url\s*\)/g
+        const noCommentsCode = code
+          .replace(multilineCommentsRE, (m) => ' '.repeat(m.length))
+          .replace(singlelineCommentsRE, (m) => ' '.repeat(m.length))
         let s: MagicString | null = null
         let match: RegExpExecArray | null
-        while ((match = importMetaUrlRE.exec(code))) {
+        while ((match = importMetaUrlRE.exec(noCommentsCode))) {
           const { 0: exp, 1: rawUrl, index } = match
 
           if (ssr) {

diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts
@@ -531,3 +531,6 @@ export function resolveHostname(
 export function arraify<T>(target: T | T[]): T[] {
   return Array.isArray(target) ? target : [target]
 }
+
+export const multilineCommentsRE = /\/\*(.|[\r\n])*?\*\//gm
+export const singlelineCommentsRE = /\/\/.*/g