Overview
The @cwa/nuxt module ships as a Nuxt layer. A layer is a self-contained Nuxt application whose pages, layouts, components, and plugins are merged into your project automatically. You don't install it manually — the module registers it for you.
What the Layer Provides
Pages (auto-registered)
CWA registers several pages automatically. These work out-of-the-box and require no configuration:
Auth pages (public):
| Route | Purpose |
|---|---|
/login | Email + password login |
/forgot-password | Request a password reset email |
/reset-password/[username]/[token] | Set a new password |
/verify-email/[username]/[token] | Verify email on registration |
/confirm-new-email/[username]/[newEmail]/[token] | Confirm email address change |
Content pages (dynamic, SSR):
| Route | Purpose |
|---|---|
/ and /* | Catch-all CWA content route — resolves routes from the API manifest and renders your layout + page template |
Admin panel (client-only, admin users only):
| Route | Purpose |
|---|---|
/_cwa | Admin dashboard |
/_cwa/pages | Manage page records |
/_cwa/layouts | Manage layout records |
/_cwa/routes | Manage routes |
/_cwa/data | Browse and edit any resource by type |
/_cwa/settings | Site config, SEO, maintenance mode |
/_cwa/users | User management |
Layout
cwa-root-layout is registered by the layer. It is the Nuxt layout used on all CWA content pages. It mounts the admin header and resource manager panel when auth.isAdmin is true, then renders the <slot /> — which is where your CWA-resolved layout component appears.
You can reference cwa-root-layout from your own pages using definePageMeta:
definePageMeta({ layout: 'cwa-root-layout' })
Reusable UI Components
The layer registers a set of <CwaUi...> components that the admin panel uses internally. These are also available in your own templates:
| Component | Description |
|---|---|
<CwaUiFormInput> | Styled text input |
<CwaUiFormSelect> | Styled select with popover option list |
<CwaUiFormToggle> | Boolean toggle switch |
<CwaUiFormFile> | File upload control (used in upload admin tabs) |
<CwaUiFormButton> | Styled button |
<CwaUiAlertInfo> | Info notice block |
<CwaUiAlertWarning> | Warning notice block |
<CwaUiProgressBar> | Animated progress bar |
<CwaUiHamburger> | Mobile hamburger icon |
These components are styled with CWA's bundled CSS (cwa.css). They are primarily intended for admin and auth pages, but you can use them anywhere.
Overriding Layer Pages
Any page the layer provides can be overridden by creating the same path in your project's app/pages/ directory. Nuxt's layer merging means your file wins:
app/pages/login.vue ← your override, takes precedence
← layer's /login is ignored
See Auth Pages for override examples.