Base Layer
@frigear-nu/base
The @frigear-nu/base package provides a reusable Nuxt layer for Frigear websites. It centralizes common module wiring,
styling, UI defaults, and content-driven page conventions so applications can avoid duplicating the same setup.
Installation
In a workspace app, add the package as a dependency and extend it from the app's nuxt.config.ts:
export default defineNuxtConfig({
extends: ['@frigear-nu/base'],
})
Content collections
The layer defines collections relative to the consuming app's content/ directory:
config—content/config.yaml, containing site-wide configuration such as title, description, and navigation.pages— Markdown pages undercontent/pages/**.config_<locale>andpages_<locale>— locale-specific equivalents when the consuming app configures locales.
Use useConfig(), useCurrentPage(), and useContentLocale() to access configuration, the current page, and the
current content locale. The layer also provides helpers for working with content and localized collections.
Composables
These composables are auto-imported in apps that extend the layer.
useConfig()
Returns the site-wide config document (or its locale-suffixed equivalent), wrapped in useAsyncData.
const { data: config } = useConfig()
The returned useAsyncData key and query are re-evaluated whenever the active content locale changes.
useContentLocale()
Resolves the active content locale from @nuxtjs/i18n (when configured) and exposes helpers for working with
locale-prefixed routes.
const { locale, defaultLocale, stripLocalePrefix, localizePath } = useContentLocale()
| Property | Type | Description |
|---|---|---|
locale | ComputedRef<string | undefined> | The current locale, limited to the app's configured locale codes; undefined when locales aren't configured or the detected locale isn't one of them. |
defaultLocale | ComputedRef<string | undefined> | The app's default locale, as reported by $i18n. |
stripLocalePrefix | (path: string) => string | Removes the current locale's route prefix from path (e.g. /en/services → /services). |
localizePath | (path: string, targetLocale: string) => string | Builds the equivalent of path for targetLocale, without relying on @nuxtjs/i18n's switchLocalePath (which can't resolve the layer's landing/catch-all routes). |
useCurrentPage()
Returns the pages collection document (or its locale-suffixed equivalent) matching the current route.
const { data: page } = useCurrentPage()
useNavigation(tags?)
Returns the navigation entries from useConfig(), optionally filtered by tag.
const { data: navigation } = useNavigation()
const { data: footerNavigation } = useNavigation(['footer'])
| Parameter | Type | Description |
|---|---|---|
tags | string[] (optional) | When provided, only entries whose tags include at least one of the given values are returned. Omit to return every navigation entry. |
Utils
The content utilities below are defined in app/utils.ts and, like the composables, are auto-imported in apps
that extend the layer. landingPageExists lives outside app/ and is a build-time helper used internally by the
layer's routing module rather than something consuming apps call directly.
localizedCollectionName(name, locale?)
Builds the locale-suffixed collection name used by content.config.ts (e.g. 'pages' + 'no' → 'pages_no').
Returns name unchanged when locale is omitted.
stringOrPropValue(prop, key)
Resolves a value that may be provided either as a plain string or as an object: returns prop itself when it's a
string, or prop[key] otherwise.
getAvailableLocales(config)
Extracts the list of locale codes from an i18n.locales config, normalizing entries that are either plain strings
or { code } objects.
getCollectionsToQuery(locale, availableLocales)
Returns the pages collection name(s) to query: the collection for the given locale when it's one of
availableLocales, every configured locale's collection when locale doesn't match, or the flat 'pages'
collection when no locales are configured.
getCollectionFromPath(path, availableLocales)
Infers the pages collection for a route path by checking whether its first path segment matches one of
availableLocales.
landingPageExists(rootDir)
Build-time helper used by the layer's routing module. Checks whether the consuming app defines its own
app/pages/index.vue; when it does, the layer leaves the index route to the app instead of taking it over.
Optional localization
Localization is opt-in and controlled by the consuming app:
- Without configured locales, use the flat
content/config.yamlandcontent/pages/**structure. - To localize content, configure locales and nest files under locale folders, for example
content/en/config.yaml,content/en/pages/**,content/da/config.yaml, andcontent/da/pages/**. - When locales are configured, the layer defines collections such as
config_enandpages_en; its content composables select the collection for the active locale.
For example, an app using @nuxtjs/i18n can configure locales in nuxt.config.ts:
export default defineNuxtConfig({
extends: ['@frigear-nu/base'],
i18n: {
locales: ['en', 'da'],
defaultLocale: 'en',
},
})
The local development guide explains how to run the consuming website.