Use content-collections for type-safe content management with markdown files. Use when building blogs, documentation sites, or any content-driven pages with frontmatter and markdown.
Content Collections transforms markdown and other content files into type-safe data collections with full TypeScript support.
npm install @content-collections/core
npm install -D @content-collections/vite # For Vite/TanStack Start
// content-collections.ts
import { defineCollection, defineConfig } from '@content-collections/core';
import { z } from 'zod';
const posts = defineCollection({
name: 'posts',
directory: 'content/posts',
include: '**/*.md',
schema: (z) => ({
title: z.string(),
description: z.string().optional(),
published: z.string().date(),
author: z.string(),
tags: z.array(z.string()).optional(),
}),
});
export default defineConfig({
collections: [posts],
});
// app.config.ts
import { defineConfig } from '@tanstack/react-start/config';
import contentCollections from '@content-collections/vite';
export default defineConfig({
vite: {
plugins: [contentCollections()],
},
});
content/
├── posts/
│ ├── hello-world.md
│ ├── getting-started.md
│ └── advanced-topics.md
└── docs/
├── introduction.md
└── api-reference.md
---