📝 setup twoslash integration

.github/workflows/docs.yml

@@ -62,6 +62,9 @@ jobs:
       - name: Install dependencies
         run: pnpm i --frozen-lockfile
 
+      - name: Build plugin (needed for Twoslash)
+        run: pnpm --filter pinia-plugin-persistedstate build
+
       - name: Build docs
         run: pnpm run docs:build
 

docs/.vitepress/config/index.ts

@@ -1,4 +1,5 @@
 import { defineConfig } from 'vitepress'
+import { transformerTwoslash } from '@shikijs/vitepress-twoslash'
 
 import { algolia } from './locales/algolia'
 import { root } from './locales/root'
@@ -11,6 +12,15 @@ export default defineConfig({
   ],
   lastUpdated: true,
   markdown: {
+    codeTransformers: [
+      transformerTwoslash({
+        twoslashOptions: {
+          compilerOptions: {
+            types: ['pinia-plugin-persistedstate'],
+          },
+        },
+      }),
+    ],
     theme: {
       light: 'catppuccin-latte',
       dark: 'catppuccin-mocha',
@@ -24,11 +34,14 @@ export default defineConfig({
         link: 'https://github.com/prazdevs/pinia-plugin-persistedstate',
       },
     ],
-    algolia: {
-      appId: '90OL5Y5T3K',
-      apiKey: '20f9f00e8b98bae16d443559f1879aa9',
-      indexName: 'pinia-plugin-persistedstate',
-      locales: algolia,
+    search: {
+      provider: 'algolia',
+      options: {
+        appId: '90OL5Y5T3K',
+        apiKey: '20f9f00e8b98bae16d443559f1879aa9',
+        indexName: 'pinia-plugin-persistedstate',
+        locales: algolia,
+      },
     },
   },
   locales: {

docs/.vitepress/theme/index.ts

@@ -1,7 +1,12 @@
+import twoslashFloating from '@shikijs/vitepress-twoslash/client'
 import theme from 'vitepress/theme'
 
+import '@shikijs/vitepress-twoslash/style.css'
 import './vars.css'
 
 export default {
-  ...theme,
+  extends: theme,
+  enhanceApp({ app }) {
+    app.use(twoslashFloating)
+  },
 }

docs/guide/index.md

@@ -27,7 +27,7 @@ This plugin is compatible with `pinia^2.0.0`, make sure you have [Pinia installe
   :::
 
 2. Add the plugin to your pinia instance:
-```ts
+```ts twoslash
 import { createPinia } from 'pinia'
 import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
 
@@ -40,7 +40,7 @@ pinia.use(piniaPluginPersistedstate)
 When declaring your store, set the new `persist` option to `true`.
 
 ::: code-group
-```ts [option syntax]
+```ts twoslash [option syntax]
 import { defineStore } from 'pinia'
 
 export const useStore = defineStore('main', {
@@ -52,8 +52,9 @@ export const useStore = defineStore('main', {
   persist: true,
 })
 ```
-```ts [setup syntax]
+```ts twoslash [setup syntax]
 import { defineStore } from 'pinia'
+import { ref } from 'vue'
 
 export const useStore = defineStore(
   'main',

docs/zh/guide/index.md

@@ -34,7 +34,7 @@
 
 2. 将插件添加到 pinia 实例上
 
-```ts
+```ts twoslash
 import { createPinia } from 'pinia'
 import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
 
@@ -47,7 +47,7 @@ pinia.use(piniaPluginPersistedstate)
 创建 Store 时，将 `persist` 选项设置为 `true`。
 
 ::: code-group
-```ts [选项式语法]
+```ts twoslash [选项式语法]
 import { defineStore } from 'pinia'
 
 export const useStore = defineStore('main', {
@@ -60,8 +60,9 @@ export const useStore = defineStore('main', {
 })
 ```
 
-```ts [组合式语法]
+```ts twoslash [组合式语法]
 import { defineStore } from 'pinia'
+import { ref } from 'vue'
 
 export const useStore = defineStore(
   'main',

package.json

@@ -3,7 +3,7 @@
   "type": "module",
   "version": "3.1.0",
   "private": true,
-  "packageManager": "pnpm@8.14.0",
+  "packageManager": "pnpm@9.0.6",
   "description": "Monorepo for pinia-plugin-persistedstate",
   "author": "prazdevs",
   "license": "MIT",
@@ -25,29 +25,31 @@
     "release:nuxt": "pnpm -F @pinia-plugin-persistedstate/nuxt run release"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^2.6.2",
-    "@types/node": "^20.10.8",
-    "@vitest/coverage-v8": "^1.1.3",
-    "@vitest/ui": "^1.1.3",
-    "bumpp": "^9.2.1",
-    "eslint": "^8.56.0",
-    "happy-dom": "^12.10.3",
-    "lint-staged": "^15.2.0",
-    "simple-git-hooks": "^2.9.0",
+    "@antfu/eslint-config": "^2.16.1",
+    "@shikijs/vitepress-twoslash": "^1.4.0",
+    "@types/node": "^20.12.8",
+    "@vitest/coverage-v8": "^1.6.0",
+    "@vitest/ui": "^1.6.0",
+    "bumpp": "^9.4.1",
+    "eslint": "^9.2.0",
+    "happy-dom": "^14.7.1",
+    "lint-staged": "^15.2.2",
+    "pinia": "^2.1.7",
+    "pinia-plugin-persistedstate": "workspace:*",
+    "simple-git-hooks": "^2.11.1",
     "stale-dep": "^0.7.0",
-    "tsup": "^8.0.1",
-    "typescript": "^5.3.3",
-    "vite": "^5.0.11",
-    "vitepress": "1.0.0-rc.36",
-    "vitepress-plugin-twoslash": "^0.9.18",
-    "vitest": "^1.1.3",
-    "vue": "^3.4.7"
+    "tsup": "^8.0.2",
+    "typescript": "^5.4.5",
+    "vite": "^5.2.11",
+    "vitepress": "1.1.4",
+    "vitepress-plugin-twoslash": "^0.10.2",
+    "vitest": "^1.6.0",
+    "vue": "^3.4.26"
   },
   "simple-git-hooks": {
     "pre-commit": "pnpm exec lint-staged"
   },
   "lint-staged": {
-    "*": "eslint --fix",
-    "docs/**/*.md": "alex"
+    "*": "eslint --fix"
   }
 }

packages/nuxt/package.json

@@ -31,16 +31,16 @@
     "@pinia/nuxt": "^0.5.0"
   },
   "dependencies": {
-    "@nuxt/kit": "^3.9.1",
+    "@nuxt/kit": "^3.11.2",
     "defu": "^6.1.4",
     "pinia-plugin-persistedstate": ">=3.2.1"
   },
   "devDependencies": {
-    "@nuxt/module-builder": "^0.5.5",
-    "@nuxt/schema": "^3.9.1",
-    "@nuxt/test-utils": "^3.9.0",
+    "@nuxt/module-builder": "^0.6.0",
+    "@nuxt/schema": "^3.11.2",
+    "@nuxt/test-utils": "^3.12.1",
     "@pinia/nuxt": "^0.5.1",
-    "eslint": "^8.56.0",
-    "nuxt": "^3.9.1"
+    "eslint": "^9.2.0",
+    "nuxt": "^3.11.2"
   }
 }