diff --git a/packages/compiler-sfc/__tests__/__snapshots__/cssVars.spec.ts.snap b/packages/compiler-sfc/__tests__/__snapshots__/cssVars.spec.ts.snap
index a5effc35..44eb668d 100644
--- a/packages/compiler-sfc/__tests__/__snapshots__/cssVars.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/__snapshots__/cssVars.spec.ts.snap
@@ -66,6 +66,25 @@ return { color }
}"
`;
+exports[`CSS vars injection codegen w/ \n` +
+ ``
+ )
+ // color should only be injected once, even if it is twice in style
+ expect(content).toMatch(`_useCssVars(_ctx => ({
+ "${mockId}-color": (color)
+})`)
+ assertCode(content)
+ })
})
})
diff --git a/packages/compiler-sfc/src/cssVars.ts b/packages/compiler-sfc/src/cssVars.ts
index 021724fd..884742f2 100644
--- a/packages/compiler-sfc/src/cssVars.ts
+++ b/packages/compiler-sfc/src/cssVars.ts
@@ -37,7 +37,10 @@ export function parseCssVars(sfc: SFCDescriptor): string[] {
sfc.styles.forEach(style => {
let match
while ((match = cssVarRE.exec(style.content))) {
- vars.push(match[1] || match[2] || match[3])
+ const variable = match[1] || match[2] || match[3]
+ if (!vars.includes(variable)) {
+ vars.push(variable)
+ }
}
})
return vars