From 9b5ff2b567f5e29cc59e23e106f2278c3feaad21 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Wed, 15 Jul 2020 18:05:35 -0400
Subject: [PATCH] fix(compiler-sfc): fix useCssVars codegen

---
 .../__tests__/__snapshots__/compileScript.spec.ts.snap | 10 +++++-----
 packages/compiler-sfc/src/compileScript.ts             |  2 +-
 packages/compiler-sfc/src/genCssVars.ts                |  2 +-
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
index e4b096b30..dd3c2472c 100644
--- a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
@@ -109,7 +109,7 @@ exports[`SFC compile <script setup> CSS vars injection <script> w/ default expor
 "const __default__ = { setup() {} }
 import { useCSSVars as __useCSSVars__ } from 'vue'
 const __injectCSSVars__ = () => {
-__useCSSVars__(_ctx => ({ color: _ctx.color }))
+__useCssVars__(_ctx => ({ color: _ctx.color }))
 }
 const __setup__ = __default__.setup
 __default__.setup = __setup__
@@ -125,7 +125,7 @@ exports[`SFC compile <script setup> CSS vars injection <script> w/ default expor
         
 import { useCSSVars as __useCSSVars__ } from 'vue'
 const __injectCSSVars__ = () => {
-__useCSSVars__(_ctx => ({ color: _ctx.color }))
+__useCssVars__(_ctx => ({ color: _ctx.color }))
 }
 const __setup__ = __default__.setup
 __default__.setup = __setup__
@@ -139,7 +139,7 @@ exports[`SFC compile <script setup> CSS vars injection <script> w/ no default ex
 const __default__ = {}
 import { useCSSVars as __useCSSVars__ } from 'vue'
 const __injectCSSVars__ = () => {
-__useCSSVars__(_ctx => ({ color: _ctx.color }))
+__useCssVars__(_ctx => ({ color: _ctx.color }))
 }
 const __setup__ = __default__.setup
 __default__.setup = __setup__
@@ -149,11 +149,11 @@ export default __default__"
 `;
 
 exports[`SFC compile <script setup> CSS vars injection w/ <script setup> 1`] = `
-"import { useCSSVars as __useCSSVars__ } from 'vue'
+"import { useCssVars as __useCssVars__ } from 'vue'
 
 export function setup() {
 const color = 'red'
-__useCSSVars__(_ctx => ({ color }))
+__useCssVars__(_ctx => ({ color }))
 return { color }
 }
 
diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index f6a639968..80800a8f7 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -557,7 +557,7 @@ export function compileScript(
 
   // inject `useCSSVars` calls
   if (hasCssVars) {
-    s.prepend(`import { useCSSVars as __useCSSVars__ } from 'vue'\n`)
+    s.prepend(`import { useCssVars as __useCssVars__ } from 'vue'\n`)
     for (const style of styles) {
       const vars = style.attrs.vars
       if (typeof vars === 'string') {
diff --git a/packages/compiler-sfc/src/genCssVars.ts b/packages/compiler-sfc/src/genCssVars.ts
index 0b9a7eba0..45139a4bc 100644
--- a/packages/compiler-sfc/src/genCssVars.ts
+++ b/packages/compiler-sfc/src/genCssVars.ts
@@ -38,7 +38,7 @@ export function genCssVarsCode(
           })
           .join('')
 
-  return `__useCSSVars__(_ctx => (${transformedString})${
+  return `__useCssVars__(_ctx => (${transformedString})${
     scoped ? `, true` : ``
   })`
 }