An open API service indexing awesome lists of open source software.

https://github.com/usefluenti/fluenti


https://github.com/usefluenti/fluenti

ai-translation compiler developer-tools i18n internationalization l10n localization nextjs nuxt react solidjs translation vite vue

Last synced: 3 months ago
JSON representation

Awesome Lists containing this project

README

          



Fluenti


Framework-agnostic, compile-time i18n — one codebase for Vue, React, Solid, and any framework.


npm version
npm downloads
CI
E2E
tests
coverage
license


~2 KB core runtime · 5-10x faster than runtime i18n · Framework-agnostic — Vue, React, Solid, Next.js, Nuxt, and more

## Why compile-time?

Traditional i18n libraries parse messages at runtime — adding bundle weight and slowing every render. Compile-time i18n resolves translations at build time, shipping plain strings and pre-compiled functions. Source text is used as the message key — no more maintaining separate ID maps.

| | Compile-time (Fluenti) | Runtime (react-i18next, vue-i18n, next-intl) |
|--|:--|:--|
| **Runtime size** | ~2 KB gzipped | 12–14 KB gzipped |
| **Message parsing** | Build time (zero at runtime) | Every render |
| **Speed** | 5-10x faster; 40x on complex ICU | Baseline |
| **Code splitting** | Per-locale, automatic | Manual or none |
| **Multi-framework** | One codebase, consistent API | One framework each |
| **Natural keys** | Source text = key | Separate ID maps |

## Features

- **Framework-agnostic core** — `@fluenti/core` works with any framework; first-class integrations for Vue, React, Solid, Next.js, Nuxt, React Router, TanStack Start, and SolidStart
- **Compile-time transforms** — messages compiled at build time, zero runtime parsing overhead
- **ICU MessageFormat** — plurals, selects, nested arguments, custom formatters
- **Vue `v-t` directive** — compile-time template transform, not a runtime directive
- **``, ``, `` components** — consistent API across Vue, React, and Solid
- **Code splitting** — lazy-load translations per locale (`dynamic`, `static`, or off)
- **SSR-safe** — locale detection via cookie, query, path, or headers; hydration script helper
- **PO + JSON catalogs** — gettext-compatible workflow with JSON alternative
- **Date / number formatting** — thin wrappers around `Intl` APIs with built-in presets
- **Plugin system** — extend extract/compile pipeline with custom hooks
- **`msg` descriptors** — lazy message constants for use outside components

## Quick Start

**Vue**

```vue

import { t } from '@fluenti/vue'
const count = 3

Hello, world!


{{ t`You have ${count} items` }}

```

**React**

```tsx
import { t } from '@fluenti/react'

function App() {
const count = 3
return (
<>

{t`Hello, world!`}


{t`You have ${count} items`}


>
)
}
```

**Solid**

```tsx
import { t } from '@fluenti/solid'

function App() {
const count = 3
return (
<>

{t`Hello, world!`}


{t`You have ${count} items`}


>
)
}
```

Same API. Same message catalogs. Different frameworks.

## Workflow

```bash
# 1. Extract messages from source files
fluenti extract --format po

# 2. Translate — edit locales/ja.po, locales/zh-CN.po

# 3. Compile catalogs to optimized JS modules
fluenti compile
```

The Vite plugin loads compiled catalogs automatically — no manual wiring needed.

## Install

```bash
# Vue
pnpm add @fluenti/core @fluenti/vue @fluenti/vite-plugin

# React
pnpm add @fluenti/core @fluenti/react @fluenti/vite-plugin

# SolidJS
pnpm add @fluenti/core @fluenti/solid @fluenti/vite-plugin

# Next.js
pnpm add @fluenti/core @fluenti/react @fluenti/next

# Nuxt
pnpm add @fluenti/nuxt @fluenti/core @fluenti/vue

# CLI (message extraction & compilation)
pnpm add -D @fluenti/cli

# vue-i18n migration bridge (optional)
pnpm add @fluenti/vue-i18n-compat
```

## Packages

| Package | Description |
|---------|-------------|
| [`@fluenti/core`](packages/core)
[![npm](https://img.shields.io/npm/v/@fluenti/core?color=4f46e5&label=)](https://www.npmjs.com/package/@fluenti/core) | Framework-agnostic core — ICU parser, compiler, interpolation, formatters. Extend to any framework. |
| [`@fluenti/vue`](packages/vue)
[![npm](https://img.shields.io/npm/v/@fluenti/vue?color=4f46e5&label=)](https://www.npmjs.com/package/@fluenti/vue) | Vue 3 — `v-t` directive, ``, `useI18n()` composable |
| [`@fluenti/react`](packages/react)
[![npm](https://img.shields.io/npm/v/@fluenti/react?color=4f46e5&label=)](https://www.npmjs.com/package/@fluenti/react) | React — `I18nProvider`, ``, ``, ``, `useI18n()` hook |
| [`@fluenti/solid`](packages/solid)
[![npm](https://img.shields.io/npm/v/@fluenti/solid?color=4f46e5&label=)](https://www.npmjs.com/package/@fluenti/solid) | SolidJS — ``, `I18nProvider`, `useI18n()` |
| [`@fluenti/next`](packages/next-plugin)
[![npm](https://img.shields.io/npm/v/@fluenti/next?color=4f46e5&label=)](https://www.npmjs.com/package/@fluenti/next) | Next.js — `withFluenti()`, RSC support, streaming SSR |
| [`@fluenti/nuxt`](packages/nuxt)
[![npm](https://img.shields.io/npm/v/@fluenti/nuxt?color=4f46e5&label=)](https://www.npmjs.com/package/@fluenti/nuxt) | Nuxt — locale-prefixed routing, SEO helpers, auto locale detection |
| [`@fluenti/cli`](packages/cli)
[![npm](https://img.shields.io/npm/v/@fluenti/cli?color=4f46e5&label=)](https://www.npmjs.com/package/@fluenti/cli) | Message extraction (Vue SFC, TSX), PO/JSON compilation, AI translation |
| [`@fluenti/vite-plugin`](packages/vite-plugin)
[![npm](https://img.shields.io/npm/v/@fluenti/vite-plugin?color=4f46e5&label=)](https://www.npmjs.com/package/@fluenti/vite-plugin) | Vite build-time transforms, virtual modules, code splitting |
| [`@fluenti/vue-i18n-compat`](packages/vue-i18n-compat)
[![npm](https://img.shields.io/npm/v/@fluenti/vue-i18n-compat?color=4f46e5&label=)](https://www.npmjs.com/package/@fluenti/vue-i18n-compat) | Progressive migration bridge between vue-i18n and Fluenti |

## Documentation

Full documentation — guides, API reference, and examples — is available at **[fluenti.dev](https://fluenti.dev)**.

- [Getting Started](https://fluenti.dev/start/introduction/)
- [Vue Quick Start](https://fluenti.dev/start/quick-start-vue/)
- [React Quick Start](https://fluenti.dev/start/quick-start-react/)
- [SolidJS Quick Start](https://fluenti.dev/start/quick-start-solid/)
- [Next.js Quick Start](https://fluenti.dev/start/quick-start-nextjs/)
- [Nuxt Quick Start](https://fluenti.dev/start/quick-start-nuxt/)
- [Code Splitting](https://fluenti.dev/advanced/code-splitting/)
- [SSR Guide](https://fluenti.dev/advanced/ssr-hydration/)
- [Framework Comparison](https://fluenti.dev/advanced/framework-comparison/)
- [vue-i18n Migration](https://fluenti.dev/frameworks/vue/migration-from-vue-i18n/)

## License

[MIT](LICENSE) - Fluenti Contributors