GitHub - gutenye/astro-i18next: Best i18next solution for Astro, emit zero JS and hot reload support.

2 min read Original article ↗

🧩 Astro I18next 🧩

i18next for Astro

Show your ❤️ and support by starring this project and following the author, Guten Ye!

Stars NPM Version License PRs Welcome TypeScript

🌟 Features

  • Zero Javascript ouptut: Runs entirely at build time, emits zero client-side JavaScript, and follows the same core idea as Astro, generating static HTML for fast load times and minimal runtime overhead.
  • Hot reload: Supports hot reloading, edit transaction files updates the page instantly.

📖 Getting Started

1. Install the package

npx astro add @gutenye/astro-i18next

2. Create translation files

Create your locale files in src/locales/:

src/locales/en.json

{
  "greeting": "Hello, World!"
}

src/locales/fr.json

{
  "greeting": "Bonjour, le Monde!"
}

3. Configure Astro

astro.config.mjs

import i18next from "@gutenye/astro-i18next";

export default defineConfig({
  integrations: [
    i18next({
      lng: "en", // default locale
      preload: ["en", "fr"], // list of supported locales
    }),
  ],
});

4. Create localized pages

Create pages under src/pages/[...locale]/ to enable locale routing:

src/pages/[...locale]/index.astro

---
import { t } from 'i18next'
export { getStaticPaths } from '@gutenye/astro-i18next'
---
<div>{t('greeting')}</div>

5. Run or build your site

npm run dev
npm run build

Visit your localized pages:

  • / → English (default locale)
  • /fr → French

🤝 Contributing

We love contributions! Whether you're fixing bugs, adding features, or improving documentation, your involvement makes this project better.

How to Contribute:

  1. Fork the Repository
  2. Make your changes (bug fixes, features, docs)
  3. Test your changes thoroughly
  4. Open a Pull Request on GitHub

Looking for ideas? Check out our issues for bugs and feature requests!

Thank you for using Astro I18next! If you found it helpful, please ⭐️ star the project ⭐ on GitHub.

Need help? Check our documentation or report an issue if you encounter any problems.

Special Thanks to All Contributors:

Contributors