From 1c06fe1d021572fcdcf187794ce8313a7593ac21 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Thu, 13 Apr 2023 15:45:58 +0800
Subject: [PATCH] chore: improve sfc-playground typing + bump repl for 3.3
 external type resolve support

close #8051
---
 packages/global.d.ts                             |  7 -------
 packages/sfc-playground/package.json             |  2 +-
 packages/sfc-playground/src/App.vue              | 12 ++++++------
 packages/sfc-playground/src/Header.vue           |  9 +++++++--
 packages/sfc-playground/src/download/download.ts |  3 ++-
 pnpm-lock.yaml                                   |  8 ++++----
 6 files changed, 20 insertions(+), 21 deletions(-)

diff --git a/packages/global.d.ts b/packages/global.d.ts
index 5992d0840d..c814ad55ea 100644
--- a/packages/global.d.ts
+++ b/packages/global.d.ts
@@ -33,13 +33,6 @@ declare module 'file-saver' {
   export function saveAs(blob: any, name: any): void
 }
 
-declare module '@vue/repl' {
-  import { ComponentOptions } from '@vue/runtime-core'
-  const Repl: ComponentOptions
-  const ReplStore: any
-  export { Repl, ReplStore }
-}
-
 declare interface String {
   /**
    * @deprecated Please use String.prototype.slice instead of String.prototype.substring in the repository.
diff --git a/packages/sfc-playground/package.json b/packages/sfc-playground/package.json
index 3652e7ff6d..848e3ee97b 100644
--- a/packages/sfc-playground/package.json
+++ b/packages/sfc-playground/package.json
@@ -12,7 +12,7 @@
     "vite": "^4.2.0"
   },
   "dependencies": {
-    "@vue/repl": "^1.3.5",
+    "@vue/repl": "^1.4.0",
     "file-saver": "^2.0.5",
     "jszip": "^3.6.0",
     "vue": "workspace:*"
diff --git a/packages/sfc-playground/src/App.vue b/packages/sfc-playground/src/App.vue
index 1bba8d6f2a..f7db1b7951 100644
--- a/packages/sfc-playground/src/App.vue
+++ b/packages/sfc-playground/src/App.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import Header from './Header.vue'
-import { Repl, ReplStore } from '@vue/repl'
+import { Repl, ReplStore, SFCOptions } from '@vue/repl'
 import { ref, watchEffect } from 'vue'
 
 const setVH = () => {
@@ -33,7 +33,7 @@ const store = new ReplStore({
 })
 
 // enable experimental features
-const sfcOptions = {
+const sfcOptions: SFCOptions = {
   script: {
     inlineTemplate: !useDevMode.value,
     isProd: !useDevMode.value,
@@ -59,10 +59,10 @@ watchEffect(() => {
 
 function toggleDevMode() {
   const dev = (useDevMode.value = !useDevMode.value)
-  sfcOptions.script.inlineTemplate =
-    sfcOptions.script.isProd =
-    sfcOptions.template.isProd =
-    sfcOptions.style.isProd =
+  sfcOptions.script!.inlineTemplate =
+    sfcOptions.script!.isProd =
+    sfcOptions.template!.isProd =
+    sfcOptions.style!.isProd =
       !dev
   store.setFiles(store.getFiles())
 }
diff --git a/packages/sfc-playground/src/Header.vue b/packages/sfc-playground/src/Header.vue
index 15f22ca66f..91ce3efc46 100644
--- a/packages/sfc-playground/src/Header.vue
+++ b/packages/sfc-playground/src/Header.vue
@@ -6,9 +6,14 @@ import Moon from './icons/Moon.vue'
 import Share from './icons/Share.vue'
 import Download from './icons/Download.vue'
 import GitHub from './icons/GitHub.vue'
+import { ReplStore } from '@vue/repl'
+
+const props = defineProps<{
+  store: ReplStore
+  dev: boolean
+  ssr: boolean
+}>()
 
-// @ts-ignore
-const props = defineProps(['store', 'dev', 'ssr'])
 const { store } = props
 
 const currentCommit = __COMMIT__
diff --git a/packages/sfc-playground/src/download/download.ts b/packages/sfc-playground/src/download/download.ts
index dd7e3761d6..81d602f125 100644
--- a/packages/sfc-playground/src/download/download.ts
+++ b/packages/sfc-playground/src/download/download.ts
@@ -5,8 +5,9 @@ import main from './template/main.js?raw'
 import pkg from './template/package.json?raw'
 import config from './template/vite.config.js?raw'
 import readme from './template/README.md?raw'
+import { ReplStore } from '@vue/repl'
 
-export async function downloadProject(store: any) {
+export async function downloadProject(store: ReplStore) {
   if (!confirm('Download project files?')) {
     return
   }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 73e9b2c6c8..b32007ae6c 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -242,13 +242,13 @@ importers:
   packages/sfc-playground:
     specifiers:
       '@vitejs/plugin-vue': ^4.1.0
-      '@vue/repl': ^1.3.5
+      '@vue/repl': ^1.4.0
       file-saver: ^2.0.5
       jszip: ^3.6.0
       vite: ^4.2.0
       vue: workspace:*
     dependencies:
-      '@vue/repl': 1.3.5_vue@packages+vue
+      '@vue/repl': 1.4.0_vue@packages+vue
       file-saver: 2.0.5
       jszip: 3.10.1
       vue: link:../vue
@@ -1193,8 +1193,8 @@ packages:
     engines: {node: '>= 0.12.0'}
     dev: true
 
-  /@vue/repl/1.3.5_vue@packages+vue:
-    resolution: {integrity: sha512-O2Z8JKE15v14pE/wgw93Aw4+L0HjhsLc68ivuj1N09WXS9oyU33NTlh7PQhb75P43fadnypBDb4djD3pUWpjBQ==}
+  /@vue/repl/1.4.0_vue@packages+vue:
+    resolution: {integrity: sha512-W/OdABvbP5WCVJ6OoGG+/ULicKTpMFhhvpN2EjCsdV8bvEBHqLSCvJmDRiMkuLOm8lYw+MSOgyTKrxnhe5TH5g==}
     peerDependencies:
       vue: ^3.2.13
     dependencies:
-- 
2.47.3