Коллекции содержимого

Коллекция содержимого (content collection) — набор однотипных записей: статей блога, авторов, проектов. Вы описываете, где лежат файлы и какие поля должны быть в их фронтматтере, а Astro проверяет каждый файл и даёт удобные функции для выборки. В Astro 5 коллекции настраиваются в одном файле — src/content.config.ts.

Файлы статей

Статьи — обычные Markdown-файлы. Создайте папку src/content/blog/ и в ней файл src/content/blog/first-post.md:

---
title: Первая статья
description: С чего начался этот блог.
pubDate: 2025-03-10
tags: [astro, блог]
---
 
Привет! Это первая статья моего блога.

Добавьте ещё одну-две статьи по тому же образцу, например learning-astro.md. Сами по себе файлы в src/content/ страницами не становятся.

Описание коллекции

Создайте файл src/content.config.ts (в папке src, рядом с pages):

// src/content.config.ts
import { defineCollection, z } from 'astro:content';
import { glob } from 'astro/loaders';
 
const blog = defineCollection({
  loader: glob({ pattern: '**/*.md', base: './src/content/blog' }),
  schema: z.object({
    title: z.string(),
    description: z.string(),
    pubDate: z.coerce.date(),
    tags: z.array(z.string()).default([]),
    draft: z.boolean().default(false),
  }),
});
 
export const collections = { blog };

Перезапустите npm run dev. Astro прочитает все файлы .md из папки src/content/blog и проверит их фронтматтер. Если всё в порядке, в терминале ничего особенного не появится.

Из чего состоит описание

Схему описывают с помощью библиотеки zod, её объект z Astro реэкспортирует. z.coerce.date() превращает строку 2025-03-10 в объект Date, а .default([]) подставляет пустой массив, если тегов в файле нет.

Кроме glob() есть загрузчик file() — он берёт все записи из одного файла JSON или YAML, например список авторов.

Что даёт схема

Если в статье забыть поле title или написать дату как вчера, Astro остановится с понятной ошибкой: укажет файл и поле. Плюс редактор узнаёт типы полей и подсказывает их при выборке.

Частая ошибка

Файл настроек кладут в корень проекта или называют по-старому src/content/config.ts. В Astro 5 он называется src/content.config.ts и лежит прямо в src/. Если Astro пишет, что коллекция не найдена, проверьте имя и место файла, а также имя в export const collections.