@getvitops/vite

Vite plugin that regenerates design-system output on build and dev.

npm i -D @getvitops/vite

A Vite plugin that generates Vitops design-system output from a design-system.json during a Vite/Astro (EmDash) build — and hot-regenerates when the config changes in dev.

// astro.config.mjs / vite.config.ts
import vitops from '@getvitops/vite';

export default {
  plugins: [
    vitops({
      input: 'design-system.json', // default
      format: 'tailwind', // 'bricks' | 'css' | 'tailwind' (default: 'tailwind')
      out: 'src/styles', // default
    }),
  ],
};

input takes a design-system.json or the larger site config that embeds one (company.json) — told apart by shape. A site config also supplies the site-level facts generation reads, so legal: {} needs no input of its own. theme picks a designSystem.themes entry other than the default.

Then import the generated stylesheet (Tailwind v4):

@import './styles/tailwind.css';