docs: refactor twoslash files

Author: posva

docs/.vitepress/config.ts

@@ -14,21 +14,21 @@ import {
   typedRouterFile,
   typedRouterFileAsModule,
   usersLoaderFile,
-  vueShimFile,
 } from './twoslash-files'
+import { extraFiles } from './twoslash/files'
 
 export default defineConfig({
   markdown: {
     codeTransformers: [
       transformerTwoslash({
         twoslashOptions: {
           extraFiles: {
+            ...extraFiles,
             'router.ts': typedRouterFileAsModule,
             'typed-router.d.ts': typedRouterFile,
             'api/index.ts': apiIndexFile,
             '../api/index.ts': apiIndexFile,
             'loaders/users.ts': usersLoaderFile,
-            'shims-vue.d.ts': vueShimFile,
           },
         },
       }),

docs/.vitepress/twoslash-files.ts

@@ -67,10 +67,3 @@ export const useUserList = defineBasicLoader(() => getUserList())
 
 export { User, getUserById, getUserList }
 `
-
-export const vueShimFile = `
-declare module '*.vue' {
-  import { defineComponent } from 'vue'
-  export default defineComponent({})
-}
-`

docs/.vitepress/twoslash/code/stores.ts

@@ -0,0 +1,3 @@
+import { defineStore } from 'pinia'
+
+export const useSomeStore = defineStore('some', {})

docs/.vitepress/twoslash/files.ts

@@ -0,0 +1,19 @@
+import fs from 'node:fs'
+import { join } from 'node:path'
+import { fileURLToPath } from 'node:url'
+
+const __dirname = fileURLToPath(new URL('.', import.meta.url))
+
+export const extraFiles = {
+  '@/stores/index.ts': fs.readFileSync(
+    join(__dirname, './code/stores.ts'),
+    'utf-8'
+  ),
+
+  'shims-vue.d.ts': `
+declare module '*.vue' {
+  import { defineComponent } from 'vue'
+  export default defineComponent({})
+}
+`.trimStart(),
+}