Pages API

Share route metadata with typed getPages and getPage helpers.

Overview

Static route files can export JSON page data. Sitex exposes that data through sitex:pages, so indexes, cards, sidebars, and metadata can use route-owned values.

Dynamic routes with bracket params are not included.

data export

Add export const data to a static TSX route.

type PostData = {
  title: string
  description: string
  publishedAt: string
}

export const data = {
  title: "Building content sites with React",
  description: "How route-owned content keeps pages local.",
  publishedAt: "2026-06-03",
} satisfies PostData

export default function PostPage() {
  return <h1>{data.title}</h1>
}

MDX pages use frontmatter as page data.

getPages

Use getPages to read all discovered page data, or pass a slash-prefixed path prefix.

import { getPages } from "sitex:pages"

export default async function BlogPage() {
  const posts = await getPages("/blog")

  return (
    <main>
      <h1>Blog</h1>
      {posts.map((post) => (
        <article key={post.path}>
          <a href={post.path}>{post.title}</a>
          <p>{post.description}</p>
        </article>
      ))}
    </main>
  )
}

page.path follows the configured trailing-slash style.

getPage

Use getPage when you know the route path.

import { getPage } from "sitex:pages"

export default async function FeaturedPost() {
  const post = await getPage("/blog/building-content-sites")

  if (!post) return null

  return <a href={post.path}>{post.title}</a>
}

The return value is Page | undefined.

TypeScript

SiteX writes generated sitex:pages types from discovered page data.

type Page = {
  path: string
  title: string
  description?: string
  publishedAt?: string
}

Use satisfies when a group of pages should share one data shape.

Limits

data can use imported values, constants, and helper functions, but the final value must be JSON-serializable.

import { defaultAuthor } from "@/data/authors"

export const data = {
  title: "Building content sites with React",
  author: defaultAuthor.name,
  tags: ["react", "content"],
}

Use strings, numbers, booleans, arrays, plain objects, and null. Do not use JSX, functions, class instances, dates, maps, sets, or cyclic values.

Because route modules run during discovery, top-level page code must be build-safe. Avoid browser-only globals, network side effects, and request-time state.