@sveltekit-i18n/base 3.3.0 → 3.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +28 -23
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -91,20 +91,26 @@ export const { handle, load, use, get } = defineI18n(config);
|
|
|
91
91
|
|
|
92
92
|
### 3. Wire it into SvelteKit
|
|
93
93
|
|
|
94
|
+
`#lib` is the `imports` entry `sv create` scaffolds in a SvelteKit 3 app's
|
|
95
|
+
`package.json`. A SvelteKit 2 app adds the same entry,
|
|
96
|
+
`"imports": { "#lib/*": "./src/lib/*" }`, or imports from `$lib/i18n` — as
|
|
97
|
+
it must on Vite 5 when `i18n` is a `.ts` file imported from a `.js` module or
|
|
98
|
+
a plain `<script>`.
|
|
99
|
+
|
|
94
100
|
```javascript
|
|
95
101
|
// src/hooks.server.js
|
|
96
|
-
export { handle } from '
|
|
102
|
+
export { handle } from '#lib/i18n.js';
|
|
97
103
|
```
|
|
98
104
|
|
|
99
105
|
```javascript
|
|
100
106
|
// src/routes/+layout.server.js and src/routes/+layout.js — the same line in both
|
|
101
|
-
export { load } from '
|
|
107
|
+
export { load } from '#lib/i18n.js';
|
|
102
108
|
```
|
|
103
109
|
|
|
104
110
|
```svelte
|
|
105
111
|
<!-- src/routes/+layout.svelte -->
|
|
106
112
|
<script>
|
|
107
|
-
import { use } from '
|
|
113
|
+
import { use } from '#lib/i18n.js';
|
|
108
114
|
|
|
109
115
|
let { data, children } = $props();
|
|
110
116
|
|
|
@@ -122,15 +128,15 @@ export { load } from '$lib/i18n';
|
|
|
122
128
|
The server picks the visitor's locale from the `Accept-Language` header (or
|
|
123
129
|
from a cookie, with `preferredLocale`), loads it per request and hands it to
|
|
124
130
|
the browser, so nothing loads twice and no visitor sees another's locale. See
|
|
125
|
-
[SvelteKit](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
126
|
-
[Server-Side Rendering](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
131
|
+
[SvelteKit](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#sveltekit) for the details and
|
|
132
|
+
[Server-Side Rendering](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#server-side-rendering) for wiring it
|
|
127
133
|
by hand.
|
|
128
134
|
|
|
129
135
|
### 4. Use in components
|
|
130
136
|
|
|
131
137
|
```svelte
|
|
132
138
|
<script>
|
|
133
|
-
import { get } from '
|
|
139
|
+
import { get } from '#lib/i18n.js';
|
|
134
140
|
|
|
135
141
|
const i18n = get();
|
|
136
142
|
</script>
|
|
@@ -232,30 +238,29 @@ A named capture group in a `RegExp` route is a load parameter: its match reaches
|
|
|
232
238
|
}
|
|
233
239
|
```
|
|
234
240
|
|
|
235
|
-
`API_ORIGIN` stands for an origin such as `https://api.example.com`: a loader runs on the server too, where `fetch` takes only an absolute URL. See [route params](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
241
|
+
`API_ORIGIN` stands for an origin such as `https://api.example.com`: a loader runs on the server too, where `fetch` takes only an absolute URL. See [route params](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#route-params) for the rules.
|
|
236
242
|
|
|
237
|
-
A loader whose source does the caching itself — a SvelteKit remote `query`, an SWR layer, an HTTP cache — sets `cache: false`. It then runs on every load trigger that selects it, sharing a fetch of it already in flight for the same params and route, and `config.cache` does not apply to it; only a hydrated snapshot holds it back, for the locale and route it was rendered for, until another locale or route is requested or a `preload()` runs, and a call handed a [`preload()`](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
243
|
+
A loader whose source does the caching itself — a SvelteKit remote `query`, an SWR layer, an HTTP cache — sets `cache: false`. It then runs on every load trigger that selects it, sharing a fetch of it already in flight for the same params and route, and `config.cache` does not apply to it; only a hydrated snapshot holds it back, for the locale and route it was rendered for, until another locale or route is requested or a `preload()` runs, and a call handed a [`preload()`](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#preloadlocale-route) token shows what that preload fetched instead of running it again. See [the loader's `cache`](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#cache-optional).
|
|
238
244
|
|
|
239
|
-
A loader that throws is logged, and the rest of the load lands without its data; it runs again on the next load trigger. SvelteKit's `redirect()` and an `error()` below 500 (told by their shape: an own `status` with a `location` or a `body`, on a value that is not an `Error`) are logged too, but they also reject the load, so a SvelteKit `load` awaiting the call hands them to SvelteKit; the rejected call is undone — what it replaced goes back — unless a later call that has not failed came in the meantime. See [the loader](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
245
|
+
A loader that throws is logged, and the rest of the load lands without its data; it runs again on the next load trigger. SvelteKit's `redirect()` and an `error()` below 500 (told by their shape: an own `status` with a `location` or a `body`, on a value that is not an `Error`) are logged too, but they also reject the load, so a SvelteKit `load` awaiting the call hands them to SvelteKit; the rejected call is undone — what it replaced goes back — unless a later call that has not failed came in the meantime. See [the loader](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#loader-required).
|
|
240
246
|
|
|
241
247
|
Both `loaders` and a loader's `routes` accept readonly arrays, so a whole-config `as const` is fine.
|
|
242
248
|
|
|
243
249
|
### `basePath`
|
|
244
250
|
|
|
245
|
-
The path the app is served under — SvelteKit's `
|
|
251
|
+
The path the app is served under — SvelteKit's `paths.base`. Every route handed in loses it on the way in, on a segment boundary only (under `/repo`, `/repo/about` is `/about`), so loader `routes` name the app's own paths. Set both from one environment variable:
|
|
246
252
|
|
|
247
253
|
```javascript
|
|
248
|
-
//
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
basePath: PUBLIC_BASE_PATH
|
|
254
|
+
// SvelteKit 3, vite.config.js: sveltekit({ paths: { base: process.env.VITE_BASE_PATH ?? '' } })
|
|
255
|
+
// SvelteKit 2, svelte.config.js: kit: { paths: { base: process.env.VITE_BASE_PATH ?? '' } }
|
|
256
|
+
basePath: import.meta.env.VITE_BASE_PATH
|
|
252
257
|
```
|
|
253
258
|
|
|
254
|
-
See [`basePath`](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
259
|
+
See [`basePath`](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#basepath).
|
|
255
260
|
|
|
256
261
|
### `translations`
|
|
257
262
|
|
|
258
|
-
Synchronous translations, available immediately. They seed the tables: the loaders of a namespace they name still run and merge into it. Hand a server's state over with [`hydrate()`](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
263
|
+
Synchronous translations, available immediately. They seed the tables: the loaders of a namespace they name still run and merge into it. Hand a server's state over with [`hydrate()`](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#hydrateenvelope) instead:
|
|
259
264
|
|
|
260
265
|
```javascript
|
|
261
266
|
translations: {
|
|
@@ -273,7 +278,7 @@ The initial locale, used when nothing else decides:
|
|
|
273
278
|
initLocale: 'en'
|
|
274
279
|
```
|
|
275
280
|
|
|
276
|
-
With [`defineI18n()`](#sveltekit) it is the locale a visitor gets when nothing they prefer is served, and it loads only when negotiation picks it ([Which locale](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
281
|
+
With [`defineI18n()`](#sveltekit) it is the locale a visitor gets when nothing they prefer is served, and it loads only when negotiation picks it ([Which locale](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#which-locale)). With `new I18n(config)` the constructor loads it right away, so leave it out of a config whose instance you [`hydrate()`](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#hydrateenvelope) by hand — its load starts before the hand-off can be applied.
|
|
277
282
|
|
|
278
283
|
### `fallbackLocale`
|
|
279
284
|
|
|
@@ -295,7 +300,7 @@ fallbackValue: '...' // Default: returns the key itself
|
|
|
295
300
|
|
|
296
301
|
### `sanitizeLocales`
|
|
297
302
|
|
|
298
|
-
How locale identifiers are normalized before they key anything: `true` (default) resolves them to their ISO form through `Intl` (`'en-us'` is `'en-US'`), `false` keeps them as authored, and a function normalizes them your way. See [`sanitizeLocales`](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
303
|
+
How locale identifiers are normalized before they key anything: `true` (default) resolves them to their ISO form through `Intl` (`'en-us'` is `'en-US'`), `false` keeps them as authored, and a function normalizes them your way. See [`sanitizeLocales`](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#sanitizelocales).
|
|
299
304
|
|
|
300
305
|
### `preprocess`
|
|
301
306
|
|
|
@@ -334,11 +339,11 @@ Or state it per instance — only its type is read, so the value can stay empty
|
|
|
334
339
|
const i18n = new I18n({ ...config, schema: {} as TranslationSchema });
|
|
335
340
|
```
|
|
336
341
|
|
|
337
|
-
Hand-write it for a small set of messages, or generate it — [@sveltekit-i18n/typegen](https://github.com/sveltekit-i18n/typegen), a separate package, generates one. A schema whose keys are not a closed set (`schema: {}`) types nothing and keeps the registry out, so keys stay plain strings. A library never registers. The registry needs base 3.1 or newer. See [`schema`](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
342
|
+
Hand-write it for a small set of messages, or generate it — [@sveltekit-i18n/typegen](https://github.com/sveltekit-i18n/typegen), a separate package, generates one. A schema whose keys are not a closed set (`schema: {}`) types nothing and keeps the registry out, so keys stay plain strings. A library never registers. The registry needs base 3.1 or newer. See [`schema`](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#schema) for the full rules.
|
|
338
343
|
|
|
339
344
|
### `cache`
|
|
340
345
|
|
|
341
|
-
Time in milliseconds the loaded translations stay fresh for. By default, loaded translations never expire — each loader (but one with [`cache: false`](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
346
|
+
Time in milliseconds the loaded translations stay fresh for. By default, loaded translations never expire — each loader (but one with [`cache: false`](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#cache-optional)) runs once per locale and [route params](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#route-params) (a loader's `routes` decide whether a load trigger considers it, and the params their named groups capture decide when it runs again).
|
|
342
347
|
|
|
343
348
|
Set a finite value when your loaders fetch from a source that can change at runtime (e.g. a CMS):
|
|
344
349
|
|
|
@@ -444,12 +449,12 @@ export const { handle, load, use, get } = defineI18n(config, { preferredLocale }
|
|
|
444
449
|
- `use(() => data)` – called once in the root `+layout.svelte`; provides the instance, follows every navigation and keeps `<html lang>` and `<html dir>` in sync
|
|
445
450
|
- `get()` – the instance, in any component below the root layout
|
|
446
451
|
|
|
447
|
-
Full API documentation: [docs/README.md](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
452
|
+
Full API documentation: [docs/README.md](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md)
|
|
448
453
|
|
|
449
454
|
## Documentation
|
|
450
455
|
|
|
451
456
|
- 🌐 [sveltekit-i18n.github.io](https://sveltekit-i18n.github.io) – The documentation site, with a live playground
|
|
452
|
-
- 📖 [Full API Documentation](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
457
|
+
- 📖 [Full API Documentation](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md) – Complete reference
|
|
453
458
|
- 📚 [Main Library Docs](https://github.com/sveltekit-i18n/lib/tree/master/docs/INDEX.md) – Guides, tutorials, and best practices
|
|
454
459
|
- 🎨 [Parsers](https://github.com/sveltekit-i18n/parsers) – Available parsers and how to create your own
|
|
455
460
|
- 💡 [Examples](https://github.com/sveltekit-i18n/lib/tree/master/examples) – Real-world usage examples
|
|
@@ -480,7 +485,7 @@ i18n.setLocale('en'); // 'en' | 'de' autocomplete here
|
|
|
480
485
|
i18n.setLocale('sv'); // still accepted — the union is a hint, not a constraint
|
|
481
486
|
```
|
|
482
487
|
|
|
483
|
-
The locales survive only when the config reaches the constructor as a literal — inline, as above, or a separate object with `as const`. An annotated or separately widened config, and any config with one dynamic locale source (`loaders: locales.map(...)`), leaves them plain `string`. See [TypeScript](https://github.com/sveltekit-i18n/base/blob/3.3.
|
|
488
|
+
The locales survive only when the config reaches the constructor as a literal — inline, as above, or a separate object with `as const`. An annotated or separately widened config, and any config with one dynamic locale source (`loaders: locales.map(...)`), leaves them plain `string`. See [TypeScript](https://github.com/sveltekit-i18n/base/blob/3.3.1/docs/README.md#typescript) for both.
|
|
484
489
|
|
|
485
490
|
## Related Packages
|
|
486
491
|
|
package/package.json
CHANGED