nuxt-kql

Nuxt Kirby

Nuxt module to interact with Kirby CMS with support for Kirby's Query Language API.

•  Release Notes
•  Read the documentation

Features

• Protected Kirby credentials when sending queries
• Supports token-based authentication with the Kirby Headless plugin (recommended)
• Handle request just like with the useFetch composable
• Multiple starter kits available
• Cached query responses
• No CORS issues!
• Strongly typed

Setup

Read the documentation

npx nuxt module add kirby

Basic Usage

Read the documentation

Add the Nuxt Kirby module to your Nuxt config:

// `nuxt.config.ts`
export default defineNuxtConfig({
  modules: ['nuxt-kirby']
})

And send queries in your template:

<script setup lang="ts">
const { data, error, status } = await useKql({
  query: 'site'
})
</script>

<template>
  <div>
    <h1>{{ data?.result?.title }}</h1>
    <pre>{{ JSON.stringify(data?.result, undefined, 2) }}</pre>
  </div>
</template>

Development

1. Clone this repository
2. Enable Corepack using corepack enable
3. Install dependencies using pnpm install
4. Run pnpm run dev:prepare
5. Start development server using pnpm run dev

License

MIT License 2022-PRESENT Johann Schopplich