Agent skill · software engineering · sickn33
markstream-vue
Integrate markstream-vue into plain Vue 3 with renderer modes, code and DOM choices, streaming state, virtualization, optional peers, and scoped components.
Why this skill is useful
Provides specific integration patterns and configuration options for markstream-vue that the AI wouldn't reliably generate on its own.
What it needs
Requires vue installed locally. About 2k tokens when loaded. Last updated 2026-08-07. 44,571 stars on the source repository.
What this skill does
Markstream Vue 3 Overview Configure the Vue 3 renderer beyond generic installation: surface modes, streaming lifecycle, code rendering, long-message virtualization, and scoped overrides. When to Use Use for a plain Vue 3 application after the package has been selected. Use markstream-nuxt when SSR-specific Nuxt boundaries matter. Workflow Inspect the existing package manager, installed package version and project conventions. A requested scoped integration already authorizes routine source/dependency edits; seek approval only for a material scope expansion or unresolved beta/alpha adoption decision. 1. Confirm Vue 3 and not Nuxt. Install only requested peers and import markstream-vue/index.css after resets. 2. Start with content. Use mode="chat" for AI streams, docs for rich documents, and minimal for lightweight non-chat surfaces. 3. Choose fenced-code rendering explicitly: pre without a peer, shiki with stream-markdown, or compatibility-named monaco backed by stream-diffs. 4. For live chat use smooth streaming auto, no fade, and an optional cursor. On completion keep the same mode, set final, and disable pacing/cursor. 5. Use nodes only for worker parsing or structural AST ownership. 6. For long transcripts, keep an existing outer message virtualizer in charge. Use Markstream logical height rather than mounted DOM height. 7. Use scoped component registration and preserve safe HTML and Mermaid strict mode. 8. Validate the smallest build/typecheck plus one incremental stream and one long-message case. Example Limitations Optional peers add bundle and browser-runtime cost. DOM-minimal mode disables wrapper-dependent features. Virtualization integration requires stable content and measurement keys. Security & Safety Notes Review dependency changes. Never enable trusted HTML or loose Mermaid rendering for untrusted model output. Verify props, export paths and peer ranges against the installed package, not a mutable upstream main. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills sickn33/markstream-vue