AI-Ready Documentation #

Documentation is read in browsers, but it is also used by coding assistants, knowledge bases, and other AI tools.

KawaPress generates a Markdown representation alongside each web page. This feature is already enabled when you use the default nagi preset, so no extra installation or configuration is required.

Copy the Current Page #

Every regular documentation page includes a Markdown action below its level-one heading.

The main button fetches and copies the Markdown for the current page. Open the adjacent menu to copy the full URL of that Markdown file instead.

The copied URL uses the origin of the website the reader is visiting and the configured base. For example, when a reader opens:

https://docs.example.com/kawapress/guide/start

KawaPress copies this Markdown URL:

https://docs.example.com/kawapress/guide/start.md

The Markdown body is fetched only when requested. It is not included in the browser JavaScript bundle.

Generated Files #

After kawapress build, every page has a corresponding .md file.

The development server provides the same URLs. You can open them while writing to inspect exactly what an AI tool receives.

llms.txt and llms-full.txt #

KawaPress also creates two entry files for every locale.

• llms.txt is a concise documentation index with page titles, Markdown links, and page descriptions.
• llms-full.txt combines every page in that locale for tools that need the complete documentation in one response.

The default locale uses:

/llms.txt
/llms-full.txt

Other locales use their own directories:

/en/llms.txt
/en/llms-full.txt

Each index contains only pages from its own locale.

Use the Plugin Independently #

nagi already includes this feature. A site that does not use nagi can install and configure the same plugin directly:

npm install --save-dev @kawapress/plugin-llms

pnpm add --save-dev @kawapress/plugin-llms

yarn add --dev @kawapress/plugin-llms

import llmsPlugin from '@kawapress/plugin-llms'
import { defineConfig } from 'kawapress'

export default defineConfig({
  plugins: [
    llmsPlugin(),
  ],
})

The Generator Plugin creates the Markdown files. Its matching Runtime Plugin automatically adds the copy interface and styles, so the runtime entry does not need to be imported manually.

Add a Site Description #

Use llms.description in the nagi configuration to add a site description. A multilingual site can provide one value per locale:

import { nagi } from 'kawapress/nagi'

export default nagi({
  llms: {
    description: {
      root: 'KawaPress Chinese documentation.',
      en: 'KawaPress English documentation.',
    },
  },
})

Use llmsTxt() when the index needs complete customization:

import { nagi } from 'kawapress/nagi'

export default nagi({
  llms: {
    llmsTxt({ defaultContent, locale }) {
      return `${defaultContent}\n<!-- locale: ${locale} -->`
    },
  },
})

The callback runs once for each locale. defaultContent is the complete default index generated by KawaPress, so it can be returned unchanged or extended.

Describe a Page #

A page's description becomes its summary in llms.txt:

---
description: Install the dependencies and create your first KawaPress site.
---

# Getting Started

Use llmsTxt when the web page and AI index need different summaries:

---
description: Create and run your first site.
llmsTxt: Install KawaPress, start the development server, and generate static files.
---

# Getting Started

Exclude a page from the Markdown output and indexes with:

---
llms: false
---

This is useful for pages that exist only for website interaction and do not make sense as standalone reading.

Vue Content Is Rendered Too #

Vue expressions, components, and <script setup> in Markdown run in a dedicated server environment. Regular Markdown keeps its source shape, while dynamic Vue content uses its rendered result.

For example:

<script setup lang="ts">
const total = 2 + 2
</script>

# Result

The final result is **{{ total }}**.

The generated Markdown contains:

# Result

The final result is **4**.

Root-level <script>, <script setup>, and <style> blocks still take part in rendering, but they are not included in the final body.

Provide Markdown for a Complex Component #

Tabs, diagrams, and interactive demos can have a clearer textual representation than their visual structure suggests. A component can provide that representation explicitly with SsgMarkdown.

First add the plugin as a direct development dependency:

npm install --save-dev @kawapress/plugin-llms

pnpm add --save-dev @kawapress/plugin-llms

yarn add --dev @kawapress/plugin-llms

Then provide separate web and Markdown representations:

<script setup lang="ts">
import { SsgMarkdown } from '@kawapress/plugin-llms/client'

const isSsgMarkdown = import.meta.env.SSG_MD
const markdown = `## Install commands

- npm: \`npm install --save-dev kawapress\`
- pnpm: \`pnpm add --save-dev kawapress\`
- Yarn: \`yarn add --dev kawapress\``
</script>

<template>
  <SsgMarkdown v-if="isSsgMarkdown" :content="markdown" />

  <CommandTabs v-else>
    <CommandTab name="npm" command="npm install --save-dev kawapress" />
    <CommandTab name="pnpm" command="pnpm add --save-dev kawapress" />
    <CommandTab name="Yarn" command="yarn add --dev kawapress" />
  </CommandTabs>
</template>

The browser keeps the interactive tabs, while the generated .md receives a concise and complete install command. The same component can therefore present the right form to both human readers and AI tools.