diff --git a/packages/cli/test/fixtures/transform-sfc/app.vue b/packages/cli/test/fixtures/transform-sfc/app.vue
new file mode 100644
index 00000000..69f974c5
--- /dev/null
+++ b/packages/cli/test/fixtures/transform-sfc/app.vue
@@ -0,0 +1,12 @@
+<script lang="ts" setup>
+const array: (number | string)[] = [1, 2, 3]
+</script>
+
+<template>
+  <div v-bind="{ array }">
+    template
+  </div>
+</template>
+
+<style scoped>
+</style>
diff --git a/packages/cli/test/utils/__snapshots__/transform-sfc.test.ts.snap b/packages/cli/test/utils/__snapshots__/transform-sfc.test.ts.snap
new file mode 100644
index 00000000..2f9e0344
--- /dev/null
+++ b/packages/cli/test/utils/__snapshots__/transform-sfc.test.ts.snap
@@ -0,0 +1,14 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`transformSFC > basic 1`] = `
+"<script setup>
+const array = [1, 2, 3];
+</script>
+
+<template>
+  <div v-bind=\\"{ array }\\">template</div>
+</template>
+
+<style scoped></style>
+"
+`;
diff --git a/packages/cli/test/utils/transform-sfc.test.ts b/packages/cli/test/utils/transform-sfc.test.ts
new file mode 100644
index 00000000..127f7ec7
--- /dev/null
+++ b/packages/cli/test/utils/transform-sfc.test.ts
@@ -0,0 +1,18 @@
+import { readFileSync } from 'node:fs'
+import { resolve } from 'node:path'
+import { describe, expect, test } from 'vitest'
+import { transformSFC } from '../../src/utils/transformers/transform-sfc'
+
+describe('transformSFC', () => {
+  const appVuePath = resolve(__dirname, '../fixtures/transform-sfc/app.vue')
+  const content = readFileSync(appVuePath, 'utf-8')
+  test('basic', async () => {
+    const result = await transformSFC({
+      name: 'app.vue',
+      content,
+    }, {
+      typescript: false,
+    } as any)
+    expect(result).toMatchSnapshot()
+  })
+})