# @nubolab-ffwd/svelte-fluent

> `svelte-fluent` is a powerful localization library for [Svelte](https://svelte.dev/) and [SvelteKit](https://kit.svelte.dev/) that enables you to integrate translations using Mozilla's natural-sounding Fluent syntax easily.

Latest version **1.0.5** (published 2025-09-30) · MIT license · 0 weekly downloads

## Install

```sh
npm install @nubolab-ffwd/svelte-fluent
pnpm add @nubolab-ffwd/svelte-fluent
yarn add @nubolab-ffwd/svelte-fluent
bun add @nubolab-ffwd/svelte-fluent
```

## Health

**Score 60/100 (C)** — status: stable.

Positive: has types; esm support; no vulnerabilities; high maintenance score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 1.0.5 |
| Published | 2025-09-30 |
| First published | 2020-07-01 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM |
| Dependencies | 4 |
| Unpacked size | 46.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 113 |
| Maintainers | sfriedel, dtldtl |

## Links

- npm: https://www.npmjs.com/package/@nubolab-ffwd/svelte-fluent
- Repository: https://github.com/nubolab-ffwd/svelte-fluent
- Issues: https://github.com/nubolab-ffwd/svelte-fluent/issues
- npm.io page: https://npm.io/package/@nubolab-ffwd/svelte-fluent

## Dependencies (4)

- [@fluent/dom](https://npm.io/package/@fluent/dom.md) ^0.10.0
- [cached-iterable](https://npm.io/package/cached-iterable.md) ^0.3.0
- [@fluent/sequence](https://npm.io/package/@fluent/sequence.md) ^0.8.0
- [@rollup/pluginutils](https://npm.io/package/@rollup/pluginutils.md) ^5.1.3

## Recent versions

- 1.0.5 (latest) — 2025-09-30
- 2.0.0-next.1 (next) — 2025-11-20
- 1.0.4 — 2025-08-05
- 1.0.3 — 2024-12-06
- 1.0.2 — 2024-12-02
- 1.0.0 — 2024-10-28
- 1.0.0-next.2 — 2024-08-23
- 0.8.1 — 2024-08-22
- 1.0.0-next.1 — 2024-06-25
- 0.8.0 — 2024-02-23
- 0.7.0 — 2023-07-17
- 0.6.2 — 2023-06-16
- 0.6.1 — 2023-06-02
- 0.6.0 — 2023-03-07
- 0.5.0 — 2023-02-24
- … 13 more at https://npm.io/package/@nubolab-ffwd/svelte-fluent/versions

## README

# Svelte Fluent [![Documentation](https://img.shields.io/badge/-Documentation-blue)](https://nubolab-ffwd.github.io/svelte-fluent/) [![svelte-fluent on npm](https://img.shields.io/npm/v/@nubolab-ffwd/svelte-fluent)](https://www.npmjs.com/package/@nubolab-ffwd/svelte-fluent) ![Tests](https://github.com/nubolab-ffwd/svelte-fluent/workflows/Tests/badge.svg) [![Svelte v5](https://img.shields.io/badge/svelte-v5-blueviolet?logo=svelte)](https://svelte.dev)

`svelte-fluent` is a powerful localization library for
[Svelte](https://svelte.dev/) and [SvelteKit](https://kit.svelte.dev/)
that enables you to integrate translations using Mozilla's natural-sounding Fluent syntax easily.

## Installation

```
npm install --save-dev @nubolab-ffwd/svelte-fluent
npm install --save jsdom
```

## Documentation

Documentation can be found at https://nubolab-ffwd.github.io/svelte-fluent/

## Example

```svelte
<script>
	import { FluentBundle, FluentResource } from '@fluent/bundle';
	import { Localized, initFluentContext, createSvelteFluent } from '@nubolab-ffwd/svelte-fluent';

	export let userName = 'Anna';
	export let userGender = 'female';
	export let photoCount = 3;

	const translations = `
# Simple things are simple.
hello-user = Hello, {$userName}!

# Complex things are possible.
shared-photos =
    {$userName} {$photoCount ->
        [one] added a new photo
       *[other] added {$photoCount} new photos
    } to {$userGender ->
        [male] his stream
        [female] her stream
       *[other] their stream
    }.
`;
	const bundle = new FluentBundle('en');
	bundle.addResource(new FluentResource(translations));

	initFluentContext(() => createSvelteFluent([bundle]));
</script>

<strong><Localized id="hello-user" args={{ userName }} /></strong>
<p>
	<Localized id="shared-photos" args={{ userName, userGender, photoCount }} />
</p>
```

---
_Source: https://npm.io/package/@nubolab-ffwd/svelte-fluent · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
