@rinova/playground-vite 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +97 -0
- package/package.json +1 -1
package/README.md
ADDED
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
# @rinova/playground-vite
|
|
2
|
+
|
|
3
|
+
`@rinova/playground` 的 Vite 插件。三件事：读 `playground.config.ts`、把 `scenes/**/*.vue` 扫成虚拟模块、按需生成契约清单。
|
|
4
|
+
|
|
5
|
+
```bash
|
|
6
|
+
pnpm add -D @rinova/playground-vite
|
|
7
|
+
```
|
|
8
|
+
|
|
9
|
+
需要 Vite `^8`（peer），并配合 `@rinova/playground` 使用；两者版本请保持一致（同一个 minor）。
|
|
10
|
+
|
|
11
|
+
## 用法
|
|
12
|
+
|
|
13
|
+
```ts
|
|
14
|
+
// vite.config.ts
|
|
15
|
+
import vue from '@vitejs/plugin-vue'
|
|
16
|
+
import { defineConfig } from 'vite'
|
|
17
|
+
import { playground } from '@rinova/playground-vite'
|
|
18
|
+
|
|
19
|
+
export default defineConfig({
|
|
20
|
+
plugins: [vue(), playground()],
|
|
21
|
+
})
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
插件会自己在项目根查找 `playground.config.{ts,mts,js,mjs}`，用 `jiti` 载入（所以配置里可以写 TypeScript）。
|
|
25
|
+
|
|
26
|
+
## 选项
|
|
27
|
+
|
|
28
|
+
| 选项 | 默认 | 说明 |
|
|
29
|
+
|---|---|---|
|
|
30
|
+
| `configFile` | 自动查找 | 指定配置文件路径（相对项目根） |
|
|
31
|
+
| `scenes` | 配置里的 `scenes` | 覆盖场景目录（相对项目根） |
|
|
32
|
+
|
|
33
|
+
`title` / `codeViewer` / `base` / `port` / `components` 等行为都在 `playground.config.ts` 里配，见 `@rinova/playground` 的配置表。
|
|
34
|
+
|
|
35
|
+
## 生成的虚拟模块
|
|
36
|
+
|
|
37
|
+
### `virtual:playground/scenes`
|
|
38
|
+
|
|
39
|
+
```ts
|
|
40
|
+
import { scenes } from 'virtual:playground/scenes'
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
```ts
|
|
44
|
+
interface SceneDescriptor {
|
|
45
|
+
id: string // 'button/size'
|
|
46
|
+
title: string // sceneMeta.title ?? 文件名推导
|
|
47
|
+
group: string // 第一级目录，如 'Button'
|
|
48
|
+
path: string // '/src/scenes/button/size.vue'
|
|
49
|
+
file: string // 绝对路径
|
|
50
|
+
rel: string // 'src/scenes/button/size.vue'
|
|
51
|
+
lang: 'vue'
|
|
52
|
+
order: number
|
|
53
|
+
tags: string[] | null
|
|
54
|
+
description: string | null
|
|
55
|
+
hidden: boolean
|
|
56
|
+
sources: { rel: string; raw: () => Promise<string> }[]
|
|
57
|
+
load: () => Promise<{ default: Component }>
|
|
58
|
+
raw: () => Promise<string>
|
|
59
|
+
}
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
`load()` / `raw()` 是动态 import，未进入侧栏的场景不会被打进首屏。
|
|
63
|
+
|
|
64
|
+
### `virtual:playground/config`
|
|
65
|
+
|
|
66
|
+
```ts
|
|
67
|
+
import config from 'virtual:playground/config'
|
|
68
|
+
// => playground.config.ts 的内容 + sceneCount
|
|
69
|
+
```
|
|
70
|
+
|
|
71
|
+
## 契约清单
|
|
72
|
+
|
|
73
|
+
配置了 `components` 时（例如 `components: ['src/components/**/*.vue']`），插件用 `vue-component-meta` 提取组件 props，产出三个文件：
|
|
74
|
+
|
|
75
|
+
```
|
|
76
|
+
.playground/manifest.json # 组件、props、类型、默认值、行号锚点
|
|
77
|
+
.playground/llms.txt # 给大模型读的能力摘要
|
|
78
|
+
.playground/coverage.md # 哪些 prop 在场景里还没被用到
|
|
79
|
+
```
|
|
80
|
+
|
|
81
|
+
`pnpm build` 时这三个文件会一起拷进 `build.outDir`；`@rinova/playground-mcp` 读的就是它们。
|
|
82
|
+
|
|
83
|
+
未配 `components` 时不会生成任何清单文件（不是报错）。
|
|
84
|
+
|
|
85
|
+
## dev 行为
|
|
86
|
+
|
|
87
|
+
| 变化 | 反应 |
|
|
88
|
+
|---|---|
|
|
89
|
+
| `scenes/` 下新增或删除 `.vue` | 失效虚拟模块 + full-reload，侧栏立刻更新 |
|
|
90
|
+
| 改 `playground.config.*` | 同上，重新扫描 |
|
|
91
|
+
| `components/` 下 `.vue` 的增删改 | 800ms 防抖后重算契约清单（不刷新页面） |
|
|
92
|
+
|
|
93
|
+
场景文件内容改动走 Vite 正常 HMR，不触发整页刷新。
|
|
94
|
+
|
|
95
|
+
## License
|
|
96
|
+
|
|
97
|
+
MIT
|
package/package.json
CHANGED