diff --git a/packages/playground/vue/src-import/script.ts b/packages/playground/vue/src-import/script.ts
index 3138fb9b3d2dd1..54e6e35db41f46 100644
--- a/packages/playground/vue/src-import/script.ts
+++ b/packages/playground/vue/src-import/script.ts
@@ -1,11 +1,11 @@
 import { defineComponent } from 'vue'
-import A from './srcImportStyle.vue'
-import B from './srcImportStyle2.vue'
+import SrcImportStyle from './srcImportStyle.vue'
+import SrcImportStyle2 from './srcImportStyle2.vue'
 
 export default defineComponent({
   components: {
-    A,
-    B
+    SrcImportStyle,
+    SrcImportStyle2
   },
   setup() {
     return {
diff --git a/packages/playground/vue/src-import/template.html b/packages/playground/vue/src-import/template.html
index 3b368b435e3c38..6b55c545daac6a 100644
--- a/packages/playground/vue/src-import/template.html
+++ b/packages/playground/vue/src-import/template.html
@@ -1,5 +1,5 @@
 <h2>SFC Src Imports</h2>
 <div class="src-imports-script">{{ msg }}</div>
 <div class="src-imports-style">This should be tan</div>
-<a></a>
-<b></b>
+<SrcImportStyle></SrcImportStyle>
+<SrcImportStyle2></SrcImportStyle2>