Live Preview

Описание

Пакет приносит iframe предпросмотра из Payload CMS в серверные и статичные фронтенды, куда не добираются официальные хуки для React и Vue. Основная цель это Astro, но в комплекте есть адаптеры для Next.js, SvelteKit, Nuxt и обычного HTML. Все они работают поверх одного общего рантайма. Правки редактора сразу попадают в iframe предпросмотра по мере набора текста, без пересборки или перезагрузки страницы. Чтобы связать элемент с полем, добавьте атрибут `data-payload-field` и зарегистрируйте адаптер. Интеграция с Astro предлагает два режима инъекции скрипта: inline и middleware. В inline режиме рантайм встраивается в каждую страницу на этапе сборки, что подходит для `output: 'static'`. В middleware режиме скрипт добавляется только в ответы для предпросмотра (запросы с `?preview=true` или `?draft=true`, заголовком `Sec-Fetch-Dest: iframe` или referer из админки), поэтому продакшен не получает лишнего. В этом режиме также объединяется директива CSP `frame-ancestors`, чтобы админка могла встроить страницу. Рантайм включает рендерер Lexical, который покрывает 16 типов узлов: upload, relationship, block, autolink, tab, indent и RTL. RichText.astro рендерится через тот же рендерер, который применяется для патчей предпросмотра, поэтому SSR-разметка и обновления предпросмотра не разойдутся. В Payload 3.x опция `serverURL` включает REST-слияние, которое подтягивает populate для документов, и поля типа relationship или upload отрисовываются как контент, а не как ID. Хелпер `buildLivePreviewUrl` заменяет ручные таблицы маршрутов в `payload.config.ts`: он маппит коллекции и глобалы на URL фронтенда и сам добавляет `?preview=true`. CLI-утилита `pll-codegen` генерирует TypeScript-интерфейсы на основе `payload.config.ts`, а типизированный хелпер `bind<T>()` даёт проверку типов при биндинге полей. Совместимость: Payload 2.x и 3.x, Astro с 4 по 7 версию, Node 20.19 и новее. Формат обмена данными проверен на `@payloadcms/live-preview` 3.86 через еженедельную CI-задачу, отслеживающую дрейф.

О пакете

Имя пакета

payload-live-preview

Последняя версия

2.0.6

Размер

10,8 МБ

Лицензия

MIT

Загрузок в неделю

79

Последняя публикация

4 окт. 2026 г.