docs: fix playground version display

shikijs · Sep 16, 2024 · 002d4e2 · 002d4e2
1 parent 41efe30
commit 002d4e2
Show file tree

Hide file tree

Showing 5 changed files with 560 additions and 391 deletions.
diff --git a/package.json b/package.json
@@ -61,7 +61,7 @@
     "yaml": "catalog:"
   },
   "resolutions": {
-    "oniguruma-to-js": "^0.4.2"
+    "oniguruma-to-js": "^0.4.3"
   },
   "simple-git-hooks": {
     "pre-commit": "npx lint-staged"

diff --git a/playground/src/App.vue b/playground/src/App.vue
@@ -3,7 +3,6 @@ import type { HighlighterCore } from '@shikijs/core'
 import { createHighlighterCore, createJavaScriptRegexEngine, createWasmOnigEngine } from '@shikijs/core'
 import { grammars, injections } from '../../packages/tm-grammars/index'
 import { themes } from '../../packages/tm-themes/index'
-import { dependencies } from '../package.json'
 import Badge from './Badge.vue'
 import SegmentControl from './SegmentControl.vue'
 import { engine, engineJsForgiving, grammar, isDark, theme } from './state'
@@ -192,6 +191,9 @@ watch(
   { flush: 'post' },
 )
 
+// @ts-expect-error DEFINE
+const version = __VERSION__
+
 useTitle(() => `${grammarObject.value?.displayName || grammar.value} - ${themeObject.value?.displayName || theme.value} - TextMate Playground`)
 
 if (import.meta.hot) {
@@ -207,7 +209,7 @@ if (import.meta.hot) {
       <a href="https://github.com/shikijs/textmate-grammars-themes" target="_blank" text-lg hover="text-primary">
         Shiki TextMate Grammar & Theme Playground
       </a>
-      <Badge :text="`Shiki v${dependencies['@shikijs/core'].replace('^', '')}`" text-sm :color="160" />
+      <Badge :text="`Shiki v${version}`" text-sm :color="160" />
       <div flex-auto />
       <label
         v-if="engine === 'js'"

diff --git a/playground/vite.config.ts b/playground/vite.config.ts
@@ -1,7 +1,9 @@
 /// <reference types="vitest" />
 
+import fs from 'node:fs/promises'
 import path from 'node:path'
 import Vue from '@vitejs/plugin-vue'
+import YAML from 'js-yaml'
 import UnoCSS from 'unocss/vite'
 import AutoImport from 'unplugin-auto-import/vite'
 import Components from 'unplugin-vue-components/vite'
@@ -16,6 +18,9 @@ export default defineConfig({
       '~/': `${path.resolve(__dirname, 'src')}/`,
     },
   },
+  define: {
+    __VERSION__: JSON.stringify((YAML.load(await fs.readFile(new URL('../pnpm-workspace.yaml', import.meta.url), 'utf-8')) as any).catalog['@shikijs/core'].replace('^', '')),
+  },
   plugins: [
     VueMacros({
       defineOptions: false,