feat(compiler-sfc): <style vars> CSS variable injection

2020-07-10 16:30:58 -04:00
parent 6647e34ce7
commit bd5c3b96be
8 changed files with 280 additions and 19 deletions
--- a/packages/compiler-sfc/tests/compileStyle.spec.ts
+++ b/packages/compiler-sfc/tests/compileStyle.spec.ts
@@ -237,6 +237,21 @@ describe('SFC scoped CSS', () => {
      ).toHaveBeenWarned()
    })
  })
+
+  describe('<style vars>', () => {
+    test('should rewrite CSS vars in scoped mode', () => {
+      const code = compileScoped(`.foo {
+        color: var(--color);
+        font-size: var(--global:font);
+      }`)
+      expect(code).toMatchInlineSnapshot(`
+        ".foo[test] {
+                color: var(--test-color);
+                font-size: var(--font);
+        }"
+      `)
+    })
+  })
 })

 describe('SFC CSS modules', () => {