Use babel to parse JS expressions in Vue/Angular (#2)

tailwindlabs · Jan 24, 2022 · c28df3a · c28df3a
1 parent 1b1689c
commit c28df3a
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 1 deletion.
diff --git a/src/index.js b/src/index.js
@@ -166,7 +166,9 @@ function transformHtml(attributes, computedAttributes = []) {
           continue
         }
 
-        let ast = recast.parse(`let __prettier_temp__ = ${attr.value}`)
+        let ast = recast.parse(`let __prettier_temp__ = ${attr.value}`, {
+          parser: prettierParserBabel.parsers.babel,
+        })
         let didChange = false
 
         astTypes.visit(ast, {

diff --git a/tests/test.js b/tests/test.js
@@ -96,6 +96,7 @@ let vue = [
   t`<div :class="'${yes}' + '${yes}'"></div>`,
   t`<div :class="['${yes}', '${yes}']"></div>`,
   t`<div :class="[cond ? '${yes}' : '${yes}']"></div>`,
+  t`<div :class="[someVar ?? '${yes}']"></div>`,
   t`<div :class="{ '${yes}': true }"></div>`,
   t`<div :class="clsx('${yes}')"></div>`,
   t`<div :class="\`${yes}\`"></div>`,