feat: optimize twoslash for svelte

SveltePress · Sep 5, 2024 · fe78373 · fe78373
1 parent f78ac5d
commit fe78373
Show file tree

Hide file tree

Showing 25 changed files with 751 additions and 342 deletions.
diff --git a/.changeset/stale-panthers-grin.md b/.changeset/stale-panthers-grin.md
@@ -0,0 +1,8 @@
+---
+"@sveltepress/theme-default": minor
+"@sveltepress/twoslash": minor
+"@sveltepress/create": minor
+"@sveltepress/vite": minor
+---
+
+feat: optimize twoslash for svelte
diff --git a/packages/create/template-js/package.json b/packages/create/template-js/package.json
@@ -12,8 +12,8 @@
     "@sveltejs/adapter-static": "^3.0.1",
     "@sveltejs/kit": "^2.5.1",
     "@sveltejs/vite-plugin-svelte": "^3.1.2",
-    "@sveltepress/theme-default": "^3.0.0",
-    "@sveltepress/vite": "^0.34.0",
+    "@sveltepress/theme-default": "^3.0.1",
+    "@sveltepress/vite": "^0.34.1",
     "@types/node": "^20.11.20",
     "svelte": "^4.2.12",
     "vite": "^5.1.4"

diff --git a/packages/create/template-ts/package.json b/packages/create/template-ts/package.json
@@ -12,8 +12,8 @@
     "@sveltejs/adapter-static": "^3.0.1",
     "@sveltejs/kit": "^2.5.1",
     "@sveltejs/vite-plugin-svelte": "^3.1.2",
-    "@sveltepress/theme-default": "^3.0.0",
-    "@sveltepress/vite": "^0.34.0",
+    "@sveltepress/theme-default": "^3.0.1",
+    "@sveltepress/vite": "^0.34.1",
     "@types/node": "^20.11.20",
     "svelte": "^4.2.12",
     "typescript": "^5.3.3",

diff --git a/packages/docs-site/svelte.config.js b/packages/docs-site/svelte.config.js
@@ -14,9 +14,6 @@ const config = {
     files: {
       serviceWorker: SERVICE_WORKER_PATH,
     },
-    serviceWorker: {
-      register: false,
-    },
     prerender: {
       handleMissingId: 'ignore',
     },

diff --git a/packages/docs-site/tsconfig.json b/packages/docs-site/tsconfig.json
@@ -1,7 +1,7 @@
 {
   "extends": "./.svelte-kit/tsconfig.json",
   "compilerOptions": {
-    "moduleResolution": "node",
+    "moduleResolution": "nodenext",
     "allowJs": true,
     "checkJs": true,
     "esModuleInterop": true,
@@ -11,7 +11,7 @@
     "sourceMap": true,
     "strict": true,
     "lib": ["ESNext"],
-    "module": "ESNext",
+    "module": "nodenext",
     "ignoreDeprecations": "5.0"
   },
   "exclude": ["deploy/index.cjs"]

diff --git a/packages/theme-default/__tests__/__snapshots__/import-code.test.ts.snap b/packages/theme-default/__tests__/__snapshots__/import-code.test.ts.snap
@@ -9,14 +9,14 @@ exports[`code import > existing and non-existing file 2`] = `
     
     <!-- svelte-ignore a11y-no-noninteractive-tabindex -->
     <pre class="shiki shiki-themes vitesse-light night-owl" style="background-color:#ffffff;--shiki-dark-bg:#011627;color:#393a34;--shiki-dark:#d6deeb" tabindex="0"><code><span class="line"><span style="color:#A0ADA0;--shiki-dark:#637777">//</span><span style="color:#A0ADA0;--shiki-dark:#637777;font-style:inherit;--shiki-dark-font-style:italic"> @noErrors</span></span>
+<span class="line"><span style="color:#AB5959;--shiki-dark:#C792EA">const</span><span style="color:#B07D48;--shiki-dark:#82AAFF;font-style:inherit;--shiki-dark-font-style:italic"> VIRTUAL_PWA_SVELTE_REGISTER</span><span style="color:#999999;--shiki-dark:#C792EA"> =</span><span style="color:#B5695977;--shiki-dark:#D9F5DD"> '</span><span style="color:#B56959;--shiki-dark:#ECC48D">virtual:pwa-register/svelte</span><span style="color:#B5695977;--shiki-dark:#D9F5DD">'</span></span>
+<span class="line"></span>
 <span class="line"><span style="color:#1E754F;--shiki-dark:#C792EA;font-style:inherit;--shiki-dark-font-style:italic">export</span><span style="color:#AB5959;--shiki-dark:#C792EA"> const</span><span style="color:#B07D48;--shiki-dark:#82AAFF;font-style:inherit;--shiki-dark-font-style:italic"> themeOptionsRef</span><span style="color:#999999;--shiki-dark:#7FDBCA">:</span><span style="color:#999999;--shiki-dark:#C792EA"> &#123;</span></span>
 <span class="line"><span style="color:#B07D48;--shiki-dark:#D6DEEB;font-style:inherit;--shiki-dark-font-style:italic">  value</span><span style="color:#AB5959;--shiki-dark:#7FDBCA">?</span><span style="color:#999999;--shiki-dark:#7FDBCA">:</span><span style="color:#2E8F82;--shiki-dark:#FFCB8B;font-style:inherit;--shiki-dark-font-style:italic"> DefaultThemeOptions</span></span>
 <span class="line"><span style="color:#999999;--shiki-dark:#C792EA">&#125;</span><span style="color:#999999;--shiki-dark:#C792EA"> =</span><span style="color:#999999;--shiki-dark:#C792EA"> &#123;</span></span>
 <span class="line"><span style="color:#998418;--shiki-dark:#C792EA;font-style:inherit;--shiki-dark-font-style:italic">  value</span><span style="color:#999999;--shiki-dark:#C792EA">:</span><span style="color:#AB5959;--shiki-dark:#82AAFF;font-style:inherit;--shiki-dark-font-style:italic"> undefined</span><span style="color:#999999;--shiki-dark:#C792EA">,</span></span>
 <span class="line"><span style="color:#999999;--shiki-dark:#C792EA">&#125;</span></span>
 <span class="line"></span>
-<span class="line"><span style="color:#1E754F;--shiki-dark:#C792EA;font-style:inherit;--shiki-dark-font-style:italic">export</span><span style="color:#AB5959;--shiki-dark:#C792EA"> const</span><span style="color:#B07D48;--shiki-dark:#82AAFF;font-style:inherit;--shiki-dark-font-style:italic"> SERVICE_WORKER_PATH</span><span style="color:#999999;--shiki-dark:#C792EA"> =</span><span style="color:#B5695977;--shiki-dark:#D9F5DD"> '</span><span style="color:#B56959;--shiki-dark:#ECC48D">./node_modules/@sveltepress/theme-default/dist/components/pwa/sw.js</span><span style="color:#B5695977;--shiki-dark:#D9F5DD">'</span></span>
-<span class="line"></span>
 <span class="line"><span style="color:#AB5959;--shiki-dark:#C792EA">const</span><span style="color:#59873A;--shiki-dark:#82AAFF;font-style:inherit;--shiki-dark-font-style:italic"> defaultTheme</span><span style="color:#999999;--shiki-dark:#7FDBCA">:</span><span style="color:#2E8F82;--shiki-dark:#FFCB8B;font-style:inherit;--shiki-dark-font-style:italic"> ThemeDefault</span><span style="color:#999999;--shiki-dark:#C792EA"> =</span><span style="color:#B07D48;--shiki-dark:#D7DBE0;font-style:inherit;--shiki-dark-font-style:italic"> options</span><span style="color:#999999;--shiki-dark:#C792EA"> =></span><span style="color:#999999;--shiki-dark:#C792EA"> &#123;</span></span>
 <span class="line"><span style="color:#B07D48;--shiki-dark:#D6DEEB;font-style:inherit;--shiki-dark-font-style:italic">  themeOptionsRef</span><span style="color:#999999;--shiki-dark:#C792EA;font-style:inherit;--shiki-dark-font-style:italic">.</span><span style="color:#B07D48;--shiki-dark:#BAEBE2;font-style:inherit;--shiki-dark-font-style:italic">value</span><span style="color:#999999;--shiki-dark:#C792EA"> =</span><span style="color:#B07D48;--shiki-dark:#D6DEEB;font-style:inherit;--shiki-dark-font-style:italic"> options</span></span>
 <span class="line"></span>

diff --git a/packages/theme-default/package.json b/packages/theme-default/package.json
@@ -22,30 +22,32 @@
   ],
   "exports": {
     ".": "./dist/index.js",
-    "./style.css": "./src/style.css",
-    "./components": {
-      "types": "./src/components/index.ts",
-      "import": "./src/components/index.ts",
-      "svelte": "./src/components/index.ts"
-    },
+    "./style.css": "./dist/style.css",
     "./context": {
-      "types": "./src/context/index.ts",
-      "import": "./src/context/index.ts",
-      "svelte": "./src/context/index.ts"
+      "types": "./dist/context/index.d.ts",
+      "import": "./dist/context/index.js",
+      "svelte": "./dist/context/index.js"
+    },
+    "./components": {
+      "svelte": "./dist/components/index.js",
+      "types": "./dist/components/index.d.ts",
+      "import": "./dist/components/index.js"
     },
     "./PageLayout.svelte": {
-      "import": "./src/components/PageLayout.svelte",
-      "svelte": "./src/components/PageLayout.svelte"
+      "svelte": "./dist/components/PageLayout.svelte",
+      "types": "./dist/components/PageLayout.svelte.d.ts",
+      "import": "./dist/components/PageLayout.svelte"
     },
     "./GlobalLayout.svelte": {
-      "import": "./src/components/GlobalLayout.svelte",
-      "svelte": "./src/components/GlobalLayout.svelte"
+      "types": "./dist/components/GlobalLayout.svelte.d.ts",
+      "import": "./dist/components/GlobalLayout.svelte",
+      "svelte": "./dist/components/GlobalLayout.svelte"
     },
     "./types": {
       "types": "./types.d.ts"
     }
   },
-  "types": "./src/index.ts",
+  "types": "./dist/index.d.ts",
   "files": [
     "dist",
     "types.d.ts"
@@ -90,35 +92,5 @@
     "unified": "^11.0.4",
     "vite": "^5.1.4",
     "vitest": "^1.3.1"
-  },
-  "publishConfig": {
-    "types": "./dist/index.d.ts",
-    "exports": {
-      ".": "./dist/index.js",
-      "./style.css": "./dist/style.css",
-      "./context": {
-        "import": "./dist/context/index.js",
-        "svelte": "./dist/context/index.js",
-        "types": "./dist/context/index.d.ts"
-      },
-      "./components": {
-        "svelte": "./dist/components/index.js",
-        "import": "./dist/components/index.js",
-        "types": "./dist/components/index.d.ts"
-      },
-      "./PageLayout.svelte": {
-        "svelte": "./dist/components/PageLayout.svelte",
-        "import": "./dist/components/PageLayout.svelte",
-        "types": "./dist/components/PageLayout.svelte.d.ts"
-      },
-      "./GlobalLayout.svelte": {
-        "import": "./dist/components/GlobalLayout.svelte",
-        "svelte": "./dist/components/GlobalLayout.svelte",
-        "types": "./dist/components/GlobalLayout.svelte.d.ts"
-      },
-      "./types": {
-        "types": "./types.d.ts"
-      }
-    }
   }
 }
diff --git a/packages/theme-default/src/constants.ts b/packages/theme-default/src/constants.ts
@@ -0,0 +1 @@
+export const SERVICE_WORKER_PATH = 'node_modules/@sveltepress/theme-default/dist/components/pwa/sw.js'
diff --git a/packages/theme-default/src/index.ts b/packages/theme-default/src/index.ts
@@ -12,6 +12,8 @@ import codeImport from './markdown/code-import.js'
 import installPkg from './markdown/install-pkg.js'
 import createPreCorePlugins from './vite-plugins/create-pre-core-plugins.js'
 
+export { SERVICE_WORKER_PATH } from './constants.js'
+
 const __dirname = fileURLToPath(new URL('.', import.meta.url))
 
 const VIRTUAL_PWA = 'virtual:pwa-info'
@@ -23,8 +25,6 @@ export const themeOptionsRef: {
   value: undefined,
 }
 
-export const SERVICE_WORKER_PATH = './node_modules/@sveltepress/theme-default/dist/components/pwa/sw.js'
-
 const defaultTheme: ThemeDefault = options => {
   themeOptionsRef.value = options
 

diff --git a/packages/theme-default/src/vite-plugins/create-pre-core-plugins.ts b/packages/theme-default/src/vite-plugins/create-pre-core-plugins.ts
@@ -4,6 +4,7 @@ import { presetIcons, presetUno, transformerDirectives } from 'unocss'
 import type { PluginOption } from 'vite'
 import type { DefaultThemeOptions } from 'virtual:sveltepress/theme-default'
 import extractorSvelte from '@unocss/extractor-svelte'
+import { SERVICE_WORKER_PATH } from '../constants.js'
 
 const THEME_OPTIONS_MODULE = 'virtual:sveltepress/theme-default'
 
@@ -92,8 +93,7 @@ export default (options?: DefaultThemeOptions) => {
           },
           server: {
             fs: {
-              // Need this for dev
-              allow: ['../theme-default/src'],
+              allow: [SERVICE_WORKER_PATH, 'node_modules/@sveltepress/theme-default/dist/fonts', '../theme-default/dist/fonts'],
             },
           },
         }

diff --git a/packages/theme-default/tsconfig.json b/packages/theme-default/tsconfig.json
@@ -1,8 +1,8 @@
 {
   "compilerOptions": {
     "declaration": true,
-    "module": "ESNext",
-    "moduleResolution": "node",
+    "module": "nodenext",
+    "moduleResolution": "nodenext",
     "outDir": "dist",
     "types": ["svelte"],
     "esModuleInterop": true,
@@ -11,4 +11,4 @@
   },
   "exclude": ["dist"],
   "include": ["src/**/*", "types.d.ts"]
-}
+}
diff --git a/packages/theme-default/types.d.ts b/packages/theme-default/types.d.ts
@@ -79,18 +79,6 @@ declare module 'virtual:sveltepress/theme-default' {
   export default options
 }
 
-
-declare module '@sveltepress/theme-default/components' {
-  export const Link: any
-  export const Floating: any
-  export const IconifyIcon: any
-  export const CopyCode: any
-  export const Expansion: any
-  export const Tabs: any
-  export const TabPanel: any
-  export const InstallPkg: any
-}
-
 declare module '@sveltepress/theme-default/context' {
   import { Writable } from 'svelte/store'
   export interface SveltepressContext {