Production Builder 1.2.5

Build only what your project actually uses. / Nur bauen, was das Projekt wirklich nutzt. Intelligente Produktionsausgabe für Go-Live — nur CSS, JS, Themes, Icons, Fonts und Motion, die deine Seiten brauchen. Nicht blind das komplette Framework ausliefern. English

Befehle

npx velinstyle build --production
# Alias:
npx velinstyle production .
velinstyle production . --explain --out ./dist/velin-production

Content-aware Trim für CSS, JS (Web Components), Themes, Icons, Fonts und Motion — nur ausliefern, was das Projekt nutzt.

Ausgabe

Standardverzeichnis: ./dist/velin-production/

Flags

velinstyle production [path] \
  --out ./dist/velin-production \
  --explain \
  --watch \
  --report ./report.json \
  --safelist modal.css,nordic,check \
  --no-js --no-icons --no-themes --no-motion --no-minify

• --out / -o — Ausgabeverzeichnis
• --explain — entfernte CSS / Themes / Icons auflisten
• --watch — bei Content-Änderung neu bauen
• --report <file> — JSON- oder Text-Report schreiben
• --safelist — zusätzliche Klassen / Themes / Icons / CSS-Dateien
• --no-js, --no-icons, --no-themes, --no-motion, --no-minify

Config

// velinstyle.config.js
export default {
  production: {
    out: './dist/velin-production',
    content: [
      './**/*.{html,htm,js,jsx,ts,tsx,vue,astro,md,mdx,twig}',
      './**/*.blade.php',
    ],
    safelist: [],
    themes: 'auto', // oder ['nordic']
  },
};

Content Scanner — Scan your project

Production extrahiert Nutzung aus Projektquellen, nicht nur HTML. Blade (.blade.php) ist first-class für Laravel.

Production Report

Production Report

CSS            168 KB  →  131 KB
Runtime        251 KB  →    0.9 KB
Icons           42 KB  →    1 KB
Themes          13     →    2
Motion          18     →    4
Components      43     →    4

Savings         71 %

vs --preset lite

Für Publish: Production. Lite nur für einen schnellen Marketing-CSS-Schnitt.

Review

velinstyle review liefert scores.optimization und weiche Warnungen, wenn Seiten noch das volle CDN-Bundle laden. Vor Deploy mit velinstyle check . --profile marketing (oder app / docs) kombinieren.

CI / Pipeline

Production nach dem App-Build (oder als eigenen Schritt) ausführen, dist/velin-production/ als Artifact speichern und HTML darauf zeigen — nicht auf den ungefilterten CDN-Pin. Bei Template- oder Komponenten-Änderungen neu bauen (lokal --watch).

Go-Live-Checkliste

1. velinstyle doctor
2. velinstyle production . --explain -o ./dist/velin-production
3. dist/velin-production/velinstyle.css + velinstyle.js (+ Themes/Icons aus diesem Ordner) verlinken
4. velinstyle review . — scores.optimization
5. velinstyle check . --profile marketing (oder app / docs)
6. Mit Production-Assets deployen; Pin 1.2.5+
7. Optional: velinstyle dashboard · velinstyle doctor . --record (Velin Experience)

Verwandt

• Customize · Production-Build
• Marketing Lite CSS
• Performance-Audit (perf bleibt audit-only)
• Deploy
• CLI-Referenz