LEARN / NUXT

RevaCSS with Nuxt

Use the existing Vue adapter. No separate Nuxt component package or module is needed. The Nuxt 4.6.1 reference application loads core CSS globally and renders native components through Vue 3.5.44.

Install the source candidates

Prepare matching CSS and pack the core and Vue adapter from the repository. Install both local tarballs in the Nuxt project. These packages remain unpublished candidates.

npm ci
npm run build:css
npm pack --ignore-scripts
npm pack ./integrations/vue --ignore-scripts

# Inside the Nuxt project:
npm install /path/to/revacss-2.0.0.tgz /path/to/revacss-vue-2.0.0.tgz

Load CSS through Nuxt configuration

export default defineNuxtConfig({
  compatibilityDate: '2026-10-14',
  devtools: { enabled: false },
  ssr: true,
  css: ['revacss/dist/reva.css'],
  build: { transpile: ['@revacss/vue'] },
  nitro: { preset: 'node-server' }
});

Set document appearance with useHead

<script setup lang="ts">
import { useHead } from '#imports';
useHead({
  title: 'RevaCSS Nuxt starter',
  htmlAttrs: { lang: 'en', 'data-theme': 'auto', 'data-font': 'system' },
  meta: [{ name: 'description', content: 'RevaCSS native components rendered by Nuxt' }]
});
</script>
<template><NuxtPage /></template>

Page overrides can set data-theme on the document root. The reference includes a dark page. Layout attributes affect its wrapper and supported nested targets; document settings belong to Nuxt head management.

Verified scope

Strict Nuxt types, the production Node server build, HTTP responses from both pages, root theme attributes, served RevaCSS, field associations, initial form models, selected options and escaped messages are checked from packed framework candidates. The form is a markup demonstration without a submission endpoint. Vue components and core CSS stay unchanged.

Browser hydration, interactive models, client-navigation head updates, physical devices and accessibility acceptance remain deferred until the 2.0 review. Nuxt supplies its normal application runtime; RevaCSS adds no theme script or scripted disclosure handling.

The Nuxt-only dependency review is complete. Its installed build/dev tree still has two unpatched upstream advisories; the reviewed production output contains neither affected package nor their named tooling references. Deploy only the built .output artifact. The reference includes an automatic output-inventory check and documents the remaining build/dev risks; this is not a clean-audit claim.

Read the reference application's complete setup and check instructions.