Skip to content

VitePress CMS

VitePress is a fast, Markdown-based static site generator — but on its own it has no way for a non-technical owner to change the words on the page. DCS adds that layer. With the @duffcloudservices/cms package, a VitePress site becomes a managed CMS: developers build the site, and the owner edits text and SEO from the DCS portal without touching code.

This page is a quick orientation for partners and developers. For the step-by-step integration, see VitePress Sites.

How it works

  1. Register the DCS Vite plugins. Add dcsContentPlugin() and dcsSeoPlugin() to your VitePress config. They inject .dcs/content.yaml and .dcs/seo.yaml at build time, so managed text and SEO ship with the built site at zero runtime cost.
  2. Mark editable text with a composable. Use useTextContent for any copy the owner should be able to change, passing a hardcoded default so the page renders correctly before any portal edits exist.
  3. The owner edits in the portal. Through the portal's visual editor, the owner changes copy on a live preview of the site — no code, no developer. See Edit Text Without a Developer.
  4. Changes ship on the next release. Managed text and SEO are baked in at build time, so edits go live when the site is rebuilt and deployed.

Why this over a traditional CMS

  • No runtime cost. Content is injected at build time and served as static HTML — there is no database call on every page view.
  • Owners stay self-service. Text, images, and SEO are editable from the portal, so simple changes never become developer tickets.
  • Developers keep control. The site is still your VitePress codebase in your repository, with full version control.
  • SEO is managed too. The useSEO composable applies portal-managed meta tags, Open Graph, Twitter Cards, canonical URLs, and JSON-LD from .dcs/seo.yaml.

VitePress isn't the only option

VitePress is the most common setup, but the same @duffcloudservices/cms model works across frameworks — there are sibling adapter packages for React, Angular, Astro, and a framework-agnostic core. See CMS Framework Adapters.

Next steps