feat: update script tag to setup and use shallowRef for Artplayer instance

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>
 ```

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>
 ```