Vue Runtime Starter
适合 Vue 3 + TypeScript 工程化生成器。
这个 starter 会默认生成一套可被完整页和模板页共同消费的结构,而不是只产出一个 Vue 页面。
对于新的标准生成器,推荐通过 generator-workbench 提供统一官方壳层。runtime 继续只负责状态、参数 schema 与渲染,宿主入口负责挂载 workbench。
推荐目录结构
txt
src/
core/
runtime/
pages/
FullPage.vue
EmbedPage.vue
platform/
sdk.ts默认能力
generator-sdk初始化与接入generator-workbench作为统一官方壳层入口runtime/index.ts暴露window.__GENERATOR_RUNTIME__FullPage.vue作为完整生成器页面EmbedPage.vue作为模板页嵌入入口PanelSchema+panelFilter用于参数面板裁剪
推荐通过 MCP 生成
text
请为我生成一个 starter-vue-runtime,生成器名叫 ornament-lab,
默认支持 auth、cloud、export,并且可以在模板页中以 embed mode 挂载。等价的 MCP 工具调用参数:
json
{
"framework": "vue",
"generator_name": "ornament-lab",
"features": ["auth", "cloud", "export"],
"env": "prod"
}模板页接入关键点
ts
await runtime.mount({
mode: 'embed',
target: 'canvas',
container: canvasContainer,
})
await runtime.mount({
mode: 'embed',
target: 'panel',
container: panelContainer,
panelFilter: {
includeGroups: ['content', 'style'],
excludeFields: ['layout'],
},
})适用场景
- 生成器本身就是 Vue 项目
- 需要把运行时、状态、页面壳层拆得更清楚
- 后续还要继续做组件化演进