Astro

O que você pode fazer:

• Escreva seu texto diretamente em arquivos .astro, frontmatter e markup: chaves, tipos e catálogos ficam em sincronia enquanto você programa
• Publique cada idioma como páginas estáticas, com dois fluxos para escolher
• No fluxo de espelho, verbaly render roda sozinho depois de cada build: cópias pré-traduzidas, hreflang e um sitemap por idioma sem passos extras
• Um build que se recusa a publicar traduções faltando, o mesmo gate de qualquer outro setup do Verbaly

Instalação

Instale o pacote com o seu gerenciador de pacotes preferido.

$ pnpm add verbaly @verbaly/astro

Conecte

import { defineConfig } from 'astro/config';
import verbaly from '@verbaly/astro';

export default defineConfig({
  integrations: [verbaly()],
});

Essa única linha injeta o plugin do Vite com a raiz do seu projeto fixada: extração ao vivo enquanto você programa, o módulo tipado virtual:verbaly e o gate do build. Os tipos gerados vivem dentro da pasta .astro própria do Astro, sem arquivos adicionados ao seu projeto. As opções são as mesmas do plugin do Vite (locales, sourceLocale, dir, failOnMissing…), inline ou no seu verbaly.config.

Escreva o texto no lugar

---
import { createRequestInstance } from 'virtual:verbaly';
const { t } = await createRequestInstance('en');
const title = t`Search and find`;
---

<h1>{title}</h1>
<p>{t`Hello ${name}, you have ${count} messages`}</p>
<img alt={t`Company logo`} src="/logo.png" />

O compilador lê seus arquivos .astro como qualquer outra fonte: o frontmatter e as expressões do markup são extraídos, cada mensagem vira uma chave estável com params tipados, e uma entrada sem tradução falha o build antes de publicar.

Duas formas de publicar os idiomas

Sites Astro são estáticos por padrão, então o idioma é decidido na hora do build. Escolha o fluxo que combina com seu routing:

Páginas por rota

Se o i18n routing do Astro é dono das suas URLs (/es/…, /pt/…), crie uma instância por página e use t como sempre. O Astro é dono das rotas; o Verbaly, dos catálogos e da segurança de tipos.

---
import { createRequestInstance } from 'virtual:verbaly';
const { t } = await createRequestInstance(Astro.currentLocale);
---

Modo espelho

Uma única árvore de páginas, cópias pré-traduzidas. Vincule seu markup com atributos data-verbaly e adicione uma seção render à sua config: depois do astro build, a integração espelha o site em dist/es/, dist/pt/… com cada mensagem pré-preenchida, mais alternates hreflang e um sitemap por idioma quando você define baseUrl. Sem flash de conteúdo sem tradução e sem trabalho no cliente.

export default {
  locales: ['en', 'es', 'pt'],
  render: { baseUrl: 'https://example.com', sitemap: true },
};