ASTRO
#astro#ssg#static#html#no-js

Astro: минимальная статическая страница без клиентского JS

Страница Astro по умолчанию рендерится в HTML при сборке. Без островков и client: директив клиентский JavaScript не отправляется.

Как использовать

  1. Скопируйте нужный фрагмент кода.
  2. Вставьте в свой проект и при необходимости измените под задачу.
  3. Проверьте зависимости и окружение (версии, переменные).

По умолчанию Astro рендерит компоненты в HTML на этапе сборки. Если не импортировать островки и не использовать client-директивы, в браузер не отправляется клиентский JS. Документация: Astro component syntax, Static SSG.

---
// src/pages/about.astro — обычная статическая страница
---
<html lang="ru">
  <head>
    <title>О проекте</title>
  </head>
  <body>
    <h1>О проекте</h1>
    <p>Контент отрендерится в HTML при сборке. Никакого клиентского JS.</p>
  </body>
</html>

С Layout (рекомендуется):

---
// src/pages/about.astro
import BaseLayout from '../layouts/BaseLayout.astro';
---
<BaseLayout title="О проекте">
  <h1>О проекте</h1>
  <p>Весь текст — статический HTML. Скрипты только из Layout, если там нет островков.</p>
</BaseLayout>

Usage:

Используйте такие страницы для лендингов, «О нас», контактов, страниц с только текстом и ссылками. Подходит для максимальной скорости и SEO без интерактива.

Notes:

⚠️ При output: "static" (по умолчанию) все такие страницы превращаются в статические HTML-файлы при astro build. Клиентский JS добавляется только компонентам с директивами client:*.

Похожие сниппеты