diff --git a/packages/cli/src/utils/transformers/transform-tw-prefix.ts b/packages/cli/src/utils/transformers/transform-tw-prefix.ts
index adaa9766..6f7495fb 100644
--- a/packages/cli/src/utils/transformers/transform-tw-prefix.ts
+++ b/packages/cli/src/utils/transformers/transform-tw-prefix.ts
@@ -26,6 +26,10 @@ export const transformTwPrefixes: Transformer = async ({
     if (template && template.loc.start.offset >= node.getPos())
       return sourceFile
 
+    const attrName = sourceFile.getDescendantAtPos(node.getPos() - 2)?.getText()
+    if (isVueFile && attrName !== 'class')
+      return sourceFile
+
     const value = node.getText()
     const hasClosingDoubleQuote = value.match(/"/g)?.length === 2
     if (value.search('\'') === -1 && hasClosingDoubleQuote) {
diff --git a/packages/cli/test/utils/__snapshots__/transform-tw-prefix.test.ts.snap b/packages/cli/test/utils/__snapshots__/transform-tw-prefix.test.ts.snap
index eccb7cc2..c72fbfa5 100644
--- a/packages/cli/test/utils/__snapshots__/transform-tw-prefix.test.ts.snap
+++ b/packages/cli/test/utils/__snapshots__/transform-tw-prefix.test.ts.snap
@@ -38,7 +38,7 @@ exports[`transform tailwind prefix 3`] = `
 
 exports[`transform tailwind prefix 4`] = `
 "<template>
-      <div :class=\\"cn('tw-bg-white hover:tw-bg-stone-100 dark:tw-bg-stone-950 dark:hover:tw-bg-stone-800', true && 'tw-text-stone-50 sm:focus:tw-text-stone-900 dark:tw-text-stone-900 dark:sm:focus:tw-text-stone-50')\\">
+      <div id=\\"testing\\" v-bind=\\"props\\" @click=\\"handleSomething\\" :data-test=\\"true\\"  :class=\\"cn('tw-bg-white hover:tw-bg-stone-100 dark:tw-bg-stone-950 dark:hover:tw-bg-stone-800', true && 'tw-text-stone-50 sm:focus:tw-text-stone-900 dark:tw-text-stone-900 dark:sm:focus:tw-text-stone-50')\\">
         foo
       </div>
     </template>
diff --git a/packages/cli/test/utils/transform-css-vars.test.ts b/packages/cli/test/utils/transform-css-vars.test.ts
index 85f18182..c0ddd280 100644
--- a/packages/cli/test/utils/transform-css-vars.test.ts
+++ b/packages/cli/test/utils/transform-css-vars.test.ts
@@ -1,9 +1,9 @@
-import { expect, test } from 'vitest'
+import { expect, it } from 'vitest'
 
 import { transform } from '../../src/utils/transformers'
 import stone from '../fixtures/colors/stone.json'
 
-test('transform css vars', async () => {
+it('transform css vars', async () => {
   expect(
     await transform({
       filename: 'app.vue',
diff --git a/packages/cli/test/utils/transform-tw-prefix.test.ts b/packages/cli/test/utils/transform-tw-prefix.test.ts
index 32552714..de92aea5 100644
--- a/packages/cli/test/utils/transform-tw-prefix.test.ts
+++ b/packages/cli/test/utils/transform-tw-prefix.test.ts
@@ -86,7 +86,7 @@ it('transform tailwind prefix', async () => {
     await transform({
       filename: 'app.vue',
       raw: `<template>
-      <div :class="cn('bg-background hover:bg-muted', true && 'text-primary-foreground sm:focus:text-accent-foreground')">
+      <div id="testing" v-bind="props" @click="handleSomething" :data-test="true"  :class="cn('bg-background hover:bg-muted', true && 'text-primary-foreground sm:focus:text-accent-foreground')">
         foo
       </div>
     </template>