docs: 添加规则测试

docs/.vitepress/components/RulePlay/index.vue

@@ -0,0 +1,33 @@
+<template>
+  <div>
+    <div class="details custom-block !p-10px">
+      <input class="w-full" v-model="inputText" placeholder="这里输入原始文本, 比如网页源码" />
+    </div>
+    <div class="details custom-block !p-10px">
+      <input class="w-full" v-model="rule" placeholder="这里输入规则, 比如 xpath, jsonpath 等等组合" />
+    </div>
+    <div class="details custom-block !p-10px">
+      <div class="min-h-40px">
+        {{ outputText || '' }}
+      </div>
+    </div>
+  </div>
+</template>
+
+
+<script setup>
+import { ref, watch, nextTick } from 'vue'
+import { createAnalyzerManager } from '@any-reader/core/browser'
+
+const analyzerManager = createAnalyzerManager()
+
+const inputText = ref('')
+const rule = ref('')
+const outputText = ref('')
+
+watch([inputText, rule], v => {
+  nextTick(async () => {
+    outputText.value = await analyzerManager.getString(rule.value, inputText.value)
+  })
+})
+</script>

docs/.vitepress/config.ts

@@ -1,41 +1,50 @@
-import { withMermaid } from "vitepress-plugin-mermaid";
+import { withMermaid } from 'vitepress-plugin-mermaid';
+import { transformerTwoslash } from '@shikijs/vitepress-twoslash';
+
+const guide = [
+  { text: '桌面端', link: '/desktop/' },
+  { text: 'VSCode 插件', link: '/vsc/' },
+  { text: '网页端', link: '/browser/' },
+  { text: 'Docker', link: '/docker/' },
+  { text: '命令行工具', link: '/cli/' },
+  { text: '规则解析库', link: '/core/' }
+];
 
 export default withMermaid({
   base: '/any-reader/',
-  lang: "zh-cn",
-  title: "any-reader",
-  titleTemplate: "any-reader",
-  description: "",
-  outDir: "./dist",
+  lang: 'zh-cn',
+  title: 'any-reader',
+  titleTemplate: 'any-reader',
+  description: '',
+  outDir: './dist',
   head: [],
   lastUpdated: true,
   cleanUrls: true,
 
   markdown: {
+    codeTransformers: [transformerTwoslash()]
   },
-  mermaid:{
-  },
+  mermaid: {},
 
   themeConfig: {
-    logo: "/logo.svg",
+    logo: '/logo.svg',
     nav: [
-      { text: "VSCode 插件", link: "/vsc/" },
-      { text: "桌面端", link: "/desktop/" },
-      { text: "网页端", link: "/browser/" },
-      { text: "Docker", link: "/docker/" },
-      { text: "命令行工具", link: "/cli/" },
-      { text: "规则解析库", link: "/core/" },
-      { text: "规则", link: "/rule/" }
+      { text: '指南', link: '/desktop/' },
+      { text: '规则', link: '/rule/' },
+      { text: '规则测试', link: '/play/' },
     ],
     search: {
-      provider: "local",
+      provider: 'local'
     },
-    sidebar: {},
+    sidebar: guide.reduce((p, v) => {
+      p[v.link] = guide;
+      return p;
+    }, {}),
     editLink: {
-      pattern: "https://github.com/aooiuu/any-reader/edit/master/docs/:path",
-      text: "编辑此页面",
+      pattern: 'https://github.com/aooiuu/any-reader/edit/master/docs/:path',
+      text: '编辑此页面'
     },
-    socialLinks: [{ icon: "github", link: "https://github.com/aooiuu/any-reader" }],
-    footer: {},
-  },
+    socialLinks: [{ icon: 'github', link: 'https://github.com/aooiuu/any-reader' }],
+    footer: {}
+  }
 });

docs/.vitepress/theme/index.ts

@@ -1,5 +1,14 @@
-import Theme from "vitepress/theme";
+import Theme from 'vitepress/theme';
+import TwoslashFloatingVue from '@shikijs/vitepress-twoslash/client';
+import '@shikijs/vitepress-twoslash/style.css';
+import 'uno.css'
+import RulePlay from '../components/RulePlay/index.vue';
 
 export default {
   ...Theme,
+
+  enhanceApp({ app }) {
+    app.use(TwoslashFloatingVue);
+    app.component('RulePlay', RulePlay);
+  }
 };

docs/index.md

@@ -40,6 +40,7 @@ pnpm run web:dev
 ├── packages
 |  ├── cli                命令行工具
 |  ├── core               规则解析库
+|  ├── legado             阅读3规则解析库(开发中)
 |  ├── rule-utils         规则转换
 |  ├── epub               epub解析
 |  ├── shared             多端通用逻辑
@@ -52,31 +53,6 @@ pnpm run web:dev
 └── scripts
 ```
 
-### 模块调用关系
-
-```mermaid
-graph TB
-    electron --> web
-    electron --> shared
-    vscode --> web
-    vscode --> shared
-    server --> web
-    server --> shared
-    shared --> core
-    shared --> epub
-    shared --> rule-utils
-```
-
-- `electron` 代码也在 `web` 里面
-- `web` 包含了各端的前端模版代码
-- `shared` 是主要的逻辑代码、与平台无关
-- `core` 用于规则解析
-- `rule-utils` 用于规则转换、创建等规则工具
-- `epub` 用于 epub 书籍解析
-- `electron` 前端使用 `ipc` 和 `shared` 通信
-- `vscode` 前端使用 `postMessage` 和 `shared` 通信
-- `网页端` 前端使用 `axios` 和 `shared` 通信
-
 ## 常见问题
 
 ### 无法使用搜索功能

docs/package.json

@@ -10,6 +10,7 @@
   },
   "devDependencies": {
     "@any-reader/core": "workspace:^",
+    "@shikijs/vitepress-twoslash": "^1.17.6",
     "mermaid": "^11.2.0",
     "vitepress": "^1.3.4",
     "vitepress-plugin-mermaid": "^2.0.16"

docs/play/index.md

@@ -0,0 +1,4 @@
+> 开发中, 目前规则部分不支持 `@filter` `@js`, 暂不支持解析流程测试
+
+<RulePlay />
+