From 88a4504e8215392e277f07db41ab9f46fc68b4d3 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Mon, 9 Aug 2021 12:17:22 -0400
Subject: [PATCH] fix(compiler-sfc): fix import usage detection for names
 containing $

fix #4274
---
 .../__tests__/__snapshots__/compileScript.spec.ts.snap   | 4 ++--
 packages/compiler-sfc/__tests__/compileScript.spec.ts    | 9 ++++++---
 packages/compiler-sfc/src/compileScript.ts               | 8 +++++---
 3 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
index 5e30973ac..85aa31337 100644
--- a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
@@ -206,7 +206,7 @@ return { x }
 
 exports[`SFC compile <script setup> imports imports not used in <template> should not be exposed 1`] = `
 "import { defineComponent as _defineComponent } from 'vue'
-import { FooBar, FooBaz, FooQux, vMyDir, x, y, z } from './x'
+import { FooBar, FooBaz, FooQux, vMyDir, x, y, z, x$y } from './x'
         
 export default _defineComponent({
   setup(__props, { expose }) {
@@ -214,7 +214,7 @@ export default _defineComponent({
 
         const fooBar: FooBar = 1
         
-return { fooBar, FooBaz, FooQux, vMyDir, x, z }
+return { fooBar, FooBaz, FooQux, vMyDir, x, z, x$y }
 }
 
 })"
diff --git a/packages/compiler-sfc/__tests__/compileScript.spec.ts b/packages/compiler-sfc/__tests__/compileScript.spec.ts
index e529bdf1c..0731d0f23 100644
--- a/packages/compiler-sfc/__tests__/compileScript.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript.spec.ts
@@ -213,11 +213,11 @@ defineExpose({ foo: 123 })
     test('imports not used in <template> should not be exposed', () => {
       const { content } = compile(`
         <script setup lang="ts">
-        import { FooBar, FooBaz, FooQux, vMyDir, x, y, z } from './x'
+        import { FooBar, FooBaz, FooQux, vMyDir, x, y, z, x$y } from './x'
         const fooBar: FooBar = 1
         </script>
         <template>
-          <FooBaz v-my-dir>{{ x }} {{ yy }}</FooBaz>
+          <FooBaz v-my-dir>{{ x }} {{ yy }} {{ x$y }}</FooBaz>
           <foo-qux/>
           <div :id="z + 'y'">FooBar</div>
         </template>
@@ -229,7 +229,10 @@ defineExpose({ foo: 123 })
       // vMyDir: used as directive v-my-dir
       // x: used in interpolation
       // y: should not be matched by {{ yy }} or 'y' in binding exps
-      expect(content).toMatch(`return { fooBar, FooBaz, FooQux, vMyDir, x, z }`)
+      // x$y: #4274 should escape special chars when creating Regex
+      expect(content).toMatch(
+        `return { fooBar, FooBaz, FooQux, vMyDir, x, z, x$y }`
+      )
     })
   })
 
diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index 320c00b52..89a33f2ec 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -332,9 +332,11 @@ export function compileScript(
 
     let isUsedInTemplate = true
     if (isTS && sfc.template && !sfc.template.src) {
-      isUsedInTemplate = new RegExp(`\\b${local}\\b`).test(
-        resolveTemplateUsageCheckString(sfc)
-      )
+      isUsedInTemplate = new RegExp(
+        // #4274 escape $ since it's a special char in regex
+        // (and is the only regex special char that is valid in identifiers)
+        `[^\\w$_]${local.replace(/\$/g, '\\$')}[^\\w$_]`
+      ).test(resolveTemplateUsageCheckString(sfc))
     }
 
     userImports[local] = {