diff --git a/packages/artplayer-vitepress/docs/en/index.md b/packages/artplayer-vitepress/docs/en/index.md
index 1f0b10f8b..b95e9e433 100644
--- a/packages/artplayer-vitepress/docs/en/index.md
+++ b/packages/artplayer-vitepress/docs/en/index.md
@@ -87,7 +87,7 @@ The player's size depends on the size of the container `container`, so your cont
   <div ref="$container" />
 </template>
 
-<script>
+<script setup>
 import Artplayer from 'artplayer'
 import { onBeforeUnmount, onMounted, ref, shallowRef } from 'vue'
 
@@ -220,7 +220,7 @@ Importing `Artplayer` will automatically import `artplayer.d.ts`
 ```vue{3}
 <script setup>
 import Artplayer from 'artplayer';
-const art = ref<Artplayer>(null);
+const art = shallowRef<Artplayer>(null);
 art.value = new Artplayer();
 </script>
 ```
diff --git a/packages/artplayer-vitepress/docs/index.md b/packages/artplayer-vitepress/docs/index.md
index bd780564a..d88a09ca4 100644
--- a/packages/artplayer-vitepress/docs/index.md
+++ b/packages/artplayer-vitepress/docs/index.md
@@ -88,7 +88,7 @@ https://unpkg.com/artplayer/dist/artplayer.js
   <div ref="$container" />
 </template>
 
-<script>
+<script setup>
 import Artplayer from 'artplayer'
 import { onBeforeUnmount, onMounted, ref, shallowRef } from 'vue'
 
@@ -220,7 +220,7 @@ export default App
 ```vue{3}
 <script setup>
 import Artplayer from 'artplayer';
-const art = ref<Artplayer>(null);
+const art = shallowRef<Artplayer>(null);
 art.value = new Artplayer();
 </script>
 ```