Composables
useCraftUri
Learn how to use the useCraftUri composable.
This composable provides an easy way to retrieve the current URI based on the defined siteMap within the nuxt.config.ts.
It enhances multisite support and simplifies querying data from your Craft CMS backend.
Usage
const uri = useCraftUri();
By default it returns the uri based on the path defined in the siteMap property in your nuxt.config.ts. You can change this behavior by changing the
siteDetectionMode to origin.
siteDetectionMode: path
// Url: http://localhost:3000/de/happy-trying
//
// Nuxt Config:
// craftcms: {
// baseUrl: 'https://cms.ddev.site',
// authToken: 'xxxx',
// siteDetectionMode: 'path',
// siteMap: [
// {
// handle: 'en',
// origin: 'http://localhost:3000',
// path: '/',
// },
// {
// handle: 'de',
// origin: 'http://localhost:3000',
// path: '/de',
// }
// ],
// },
const uri = useCraftUri();
// uri.value will result in: "happy-trying"
siteDetectionMode: origin
// Url: https://en-site.ddev.site/happy-trying
//
// Nuxt Config:
// craftcms: {
// baseUrl: 'https://cms.ddev.site',
// authToken: 'xxxx',
// siteDetectionMode: 'origin',
// siteMap: [
// {
// handle: 'en',
// origin: 'https://en-site.ddev.site',
// path: '/',
// },
// {
// handle: 'en',
// origin: 'https://de-site.ddev.site',
// path: '/',
// }
// ],
// },
const uri = useCraftUri();
// uri.value will result in: "happy-trying"
Note
To use this composable, you have to define your sites in the siteMap property in the nuxt.config.ts.
Type
function useCraftUri(): ComputedRef<string>;