Vue Runtime Starter

Suitable for Vue 3 + TypeScript engineered generators.

This starter generates a structure that can be consumed by both full pages and template hosts, rather than just outputting a single Vue page.

For new generators, the recommended host shell is generator-workbench. Keep the runtime focused on state, schema, and rendering, then mount the official shell from App.vue or another host entry.

Recommended Directory Structure

src/
  core/
  runtime/
  pages/
    FullPage.vue
    EmbedPage.vue
  platform/
    sdk.ts

Default Capabilities

• generator-sdk initialization and integration.
• generator-workbench as the official shell entry.
• runtime/index.ts exposes window.__GENERATOR_RUNTIME__.
• FullPage.vue as the full generator page.
• EmbedPage.vue as the entry point for template host embedding.
• PanelSchema + panelFilter for parameter panel tailoring.

Recommended Generation via MCP

Please generate a starter-vue-runtime for me.
Generator name: ornament-lab.
Support auth, cloud, and export by default.
Enable embed mode mounting for template hosts.

Equivalent MCP tool parameters:

{
  "framework": "vue",
  "generator_name": "ornament-lab",
  "features": ["auth", "cloud", "export"],
  "env": "prod"
}

Key Integration Points for Template Hosts

await runtime.mount({
  mode: 'embed',
  target: 'canvas',
  container: canvasContainer,
});

await runtime.mount({
  mode: 'embed',
  target: 'panel',
  container: panelContainer,
  panelFilter: {
    includeGroups: ['content', 'style'],
    excludeFields: ['layout'],
  },
});

Use Cases

• Generators built as Vue projects.
• Scenarios requiring clear separation between runtime, state, and page shell.
• Future component-based evolution.

Next Steps

• Learn about the Runtime Contract.
• View the Template Host Demo.