@intlayer/docs 8.7.8 → 8.7.10
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/docs/ar/dictionary/insertion.md +0 -52
- package/docs/ar/intlayer_with_astro.md +55 -6
- package/docs/ar/per_locale_file.md +0 -46
- package/docs/de/dictionary/insertion.md +0 -92
- package/docs/de/intlayer_with_astro.md +55 -6
- package/docs/de/intlayer_with_nextjs_16.md +0 -23
- package/docs/de/per_locale_file.md +0 -44
- package/docs/en/dictionary/insertion.md +0 -55
- package/docs/en/intlayer_with_astro.md +2 -1
- package/docs/en/per_locale_file.md +0 -43
- package/docs/en-GB/dictionary/insertion.md +0 -56
- package/docs/en-GB/intlayer_with_astro.md +55 -6
- package/docs/en-GB/per_locale_file.md +0 -43
- package/docs/es/dictionary/insertion.md +0 -52
- package/docs/es/intlayer_with_astro.md +55 -7
- package/docs/es/intlayer_with_nextjs_14.md +0 -23
- package/docs/es/intlayer_with_nextjs_16.md +0 -23
- package/docs/es/packages/next-intlayer/index.md +0 -52
- package/docs/es/packages/react-intlayer/index.md +0 -52
- package/docs/es/per_locale_file.md +0 -43
- package/docs/fr/dictionary/insertion.md +0 -52
- package/docs/fr/intlayer_with_astro.md +55 -7
- package/docs/fr/packages/react-intlayer/index.md +0 -52
- package/docs/fr/per_locale_file.md +0 -46
- package/docs/hi/dictionary/insertion.md +0 -91
- package/docs/hi/intlayer_with_astro.md +55 -6
- package/docs/hi/packages/intlayer/index.md +0 -52
- package/docs/hi/per_locale_file.md +0 -43
- package/docs/id/dictionary/insertion.md +0 -91
- package/docs/id/intlayer_with_astro.md +55 -6
- package/docs/id/intlayer_with_nextjs_14.md +0 -24
- package/docs/id/per_locale_file.md +0 -44
- package/docs/it/dictionary/insertion.md +0 -52
- package/docs/it/intlayer_with_astro.md +55 -6
- package/docs/it/per_locale_file.md +0 -44
- package/docs/ja/dictionary/insertion.md +0 -56
- package/docs/ja/intlayer_with_astro.md +55 -7
- package/docs/ja/intlayer_with_nextjs_14.md +0 -23
- package/docs/ja/per_locale_file.md +0 -43
- package/docs/ko/dictionary/insertion.md +0 -56
- package/docs/ko/intlayer_with_astro.md +55 -7
- package/docs/ko/per_locale_file.md +0 -43
- package/docs/pl/dictionary/insertion.md +0 -85
- package/docs/pl/intlayer_with_astro.md +55 -6
- package/docs/pl/per_locale_file.md +0 -44
- package/docs/pt/dictionary/insertion.md +0 -93
- package/docs/pt/intlayer_with_astro.md +55 -6
- package/docs/pt/intlayer_with_nextjs_page_router.md +0 -23
- package/docs/pt/per_locale_file.md +0 -44
- package/docs/ru/dictionary/insertion.md +0 -52
- package/docs/ru/intlayer_with_astro.md +55 -7
- package/docs/ru/per_locale_file.md +0 -44
- package/docs/tr/dictionary/insertion.md +0 -52
- package/docs/tr/intlayer_with_astro.md +55 -6
- package/docs/tr/per_locale_file.md +0 -43
- package/docs/uk/dictionary/insertion.md +0 -52
- package/docs/uk/intlayer_with_astro.md +55 -6
- package/docs/uk/per_locale_file.md +0 -43
- package/docs/vi/dictionary/insertion.md +0 -85
- package/docs/vi/intlayer_with_astro.md +55 -6
- package/docs/vi/per_locale_file.md +0 -46
- package/docs/zh/dictionary/insertion.md +0 -54
- package/docs/zh/intlayer_with_astro.md +55 -7
- package/docs/zh/per_locale_file.md +0 -44
- package/package.json +6 -6
|
@@ -178,20 +178,69 @@ You can consume the dictionaries directly in your `.astro` files using the core
|
|
|
178
178
|
|
|
179
179
|
```astro fileName="src/pages/index.astro"
|
|
180
180
|
---
|
|
181
|
-
import {
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
181
|
+
import {
|
|
182
|
+
getIntlayer,
|
|
183
|
+
getLocaleFromPath,
|
|
184
|
+
getLocalizedUrl,
|
|
185
|
+
defaultLocale,
|
|
186
|
+
localeMap,
|
|
187
|
+
getHTMLTextDir,
|
|
188
|
+
type LocalesValues,
|
|
189
|
+
} from "intlayer";
|
|
190
|
+
import LocaleSwitcher from "../components/LocaleSwitcher.astro";
|
|
191
|
+
|
|
192
|
+
// Get the current locale from the URL (e.g. /es/about -> 'es')
|
|
193
|
+
const locale = getLocaleFromPath(Astro.url.pathname) as LocalesValues;
|
|
194
|
+
|
|
195
|
+
// Get the content for the 'app' dictionary
|
|
196
|
+
const { title } = getIntlayer("app", locale);
|
|
185
197
|
---
|
|
186
198
|
|
|
187
|
-
|
|
199
|
+
<!doctype html>
|
|
200
|
+
<html lang={locale} dir={getHTMLTextDir(locale)}>
|
|
188
201
|
<head>
|
|
189
202
|
<meta charset="utf-8" />
|
|
190
203
|
<meta name="viewport" content="width=device-width" />
|
|
204
|
+
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
191
205
|
<title>{title}</title>
|
|
206
|
+
|
|
207
|
+
<!-- Canonical link: Tells search engines which is the primary version of this page -->
|
|
208
|
+
<link
|
|
209
|
+
rel="canonical"
|
|
210
|
+
href={new URL(getLocalizedUrl(Astro.url.pathname, locale), Astro.site)}
|
|
211
|
+
/>
|
|
212
|
+
|
|
213
|
+
<!-- Hreflang: Tell Google about all localized versions -->
|
|
214
|
+
{
|
|
215
|
+
localeMap(({ locale: mapLocale }) => (
|
|
216
|
+
<link
|
|
217
|
+
rel="alternate"
|
|
218
|
+
hreflang={mapLocale}
|
|
219
|
+
href={new URL(
|
|
220
|
+
getLocalizedUrl(Astro.url.pathname, mapLocale),
|
|
221
|
+
Astro.site
|
|
222
|
+
)}
|
|
223
|
+
/>
|
|
224
|
+
))
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
<!-- x-default: Fallback for users in unmatched languages -->
|
|
228
|
+
<link
|
|
229
|
+
rel="alternate"
|
|
230
|
+
hreflang="x-default"
|
|
231
|
+
href={new URL(
|
|
232
|
+
getLocalizedUrl(Astro.url.pathname, defaultLocale),
|
|
233
|
+
Astro.site
|
|
234
|
+
)}
|
|
235
|
+
/>
|
|
192
236
|
</head>
|
|
193
237
|
<body>
|
|
194
|
-
<
|
|
238
|
+
<header>
|
|
239
|
+
<LocaleSwitcher />
|
|
240
|
+
</header>
|
|
241
|
+
<main>
|
|
242
|
+
<h1>{title}</h1>
|
|
243
|
+
</main>
|
|
195
244
|
</body>
|
|
196
245
|
</html>
|
|
197
246
|
```
|
|
@@ -144,49 +144,6 @@ const helloWorldContent = {
|
|
|
144
144
|
export default helloWorldContent;
|
|
145
145
|
```
|
|
146
146
|
|
|
147
|
-
```tsx fileName="hello-world.es.content.mjs" contentDeclarationFormat="esm"
|
|
148
|
-
import { t, Locales } from "intlayer";
|
|
149
|
-
|
|
150
|
-
/** @type {import('intlayer').Dictionary} */
|
|
151
|
-
const helloWorldContent = {
|
|
152
|
-
key: "hello-world",
|
|
153
|
-
locale: Locales.SPANISH, // Important
|
|
154
|
-
content: { multilingualContent: "Título de mi componente" },
|
|
155
|
-
};
|
|
156
|
-
|
|
157
|
-
export default helloWorldContent;
|
|
158
|
-
```
|
|
159
|
-
|
|
160
|
-
```js fileName="hello-world.en.content.cjs" contentDeclarationFormat="commonjs"
|
|
161
|
-
const { t, Locales } = require("intlayer");
|
|
162
|
-
|
|
163
|
-
/** @type {import('intlayer').Dictionary} */
|
|
164
|
-
const helloWorldContent = {
|
|
165
|
-
key: "hello-world",
|
|
166
|
-
locale: Locales.ENGLISH, // Important
|
|
167
|
-
content: {
|
|
168
|
-
multilingualContent: "Title of my component",
|
|
169
|
-
},
|
|
170
|
-
};
|
|
171
|
-
|
|
172
|
-
module.exports = helloWorldContent;
|
|
173
|
-
```
|
|
174
|
-
|
|
175
|
-
```tsx fileName="hello-world.es.content.cjs" contentDeclarationFormat="commonjs"
|
|
176
|
-
const { t, Locales } = require("intlayer");
|
|
177
|
-
|
|
178
|
-
/** @type {import('intlayer').Dictionary} */
|
|
179
|
-
const helloWorldContent = {
|
|
180
|
-
key: "hello-world",
|
|
181
|
-
locale: Locales.SPANISH, // Important
|
|
182
|
-
content: {
|
|
183
|
-
multilingualContent: "Título de mi componente",
|
|
184
|
-
},
|
|
185
|
-
};
|
|
186
|
-
|
|
187
|
-
module.exports = helloWorldContent;
|
|
188
|
-
```
|
|
189
|
-
|
|
190
147
|
```json5 fileName="hello-world.en.content.json" contentDeclarationFormat="json"
|
|
191
148
|
{
|
|
192
149
|
"$schema": "https://intlayer.org/schema.json",
|
|
@@ -54,34 +54,6 @@ Para configurar contenido de inserción en tu proyecto Intlayer, crea un módulo
|
|
|
54
54
|
export default myInsertionContent;
|
|
55
55
|
```
|
|
56
56
|
|
|
57
|
-
```javascript fileName="**/*.content.mjs" contentDeclarationFormat="esm"
|
|
58
|
-
import { insert } from "intlayer";
|
|
59
|
-
|
|
60
|
-
/** @type {import('intlayer').Dictionary} */
|
|
61
|
-
const myInsertionContent = {
|
|
62
|
-
key: "my_key",
|
|
63
|
-
content: {
|
|
64
|
-
myInsertion: insert("Hola, mi nombre es {{name}} y tengo {{age}} años."),
|
|
65
|
-
},
|
|
66
|
-
};
|
|
67
|
-
|
|
68
|
-
export default myInsertionContent;
|
|
69
|
-
```
|
|
70
|
-
|
|
71
|
-
```javascript fileName="**/*.content.cjs" contentDeclarationFormat="commonjs"
|
|
72
|
-
const { insert } = require("intlayer");
|
|
73
|
-
|
|
74
|
-
/** @type {import('intlayer').Dictionary} */
|
|
75
|
-
const myInsertionContent = {
|
|
76
|
-
key: "my_key",
|
|
77
|
-
content: {
|
|
78
|
-
myInsertion: insert("Hola, mi nombre es {{name}} y tengo {{age}} años."),
|
|
79
|
-
},
|
|
80
|
-
};
|
|
81
|
-
|
|
82
|
-
module.exports = myInsertionContent;
|
|
83
|
-
```
|
|
84
|
-
|
|
85
57
|
```json5 fileName="**/*.content.json" contentDeclarationFormat="json"
|
|
86
58
|
{
|
|
87
59
|
"$schema": "https://intlayer.org/schema.json",
|
|
@@ -112,30 +84,6 @@ Para configurar contenido de inserción en tu proyecto Intlayer, crea un módulo
|
|
|
112
84
|
export default myInsertionContent;
|
|
113
85
|
```
|
|
114
86
|
|
|
115
|
-
```javascript fileName="**/*.content.mjs" contentDeclarationFormat="esm"
|
|
116
|
-
/** @type {import('intlayer').Dictionary} */
|
|
117
|
-
const myInsertionContent = {
|
|
118
|
-
key: "my_key",
|
|
119
|
-
content: {
|
|
120
|
-
myInsertion: "Hola, mi nombre es {{name}} y tengo {{age}} años.",
|
|
121
|
-
},
|
|
122
|
-
};
|
|
123
|
-
|
|
124
|
-
export default myInsertionContent;
|
|
125
|
-
```
|
|
126
|
-
|
|
127
|
-
```javascript fileName="**/*.content.cjs" contentDeclarationFormat="commonjs"
|
|
128
|
-
/** @type {import('intlayer').Dictionary} */
|
|
129
|
-
const myInsertionContent = {
|
|
130
|
-
key: "my_key",
|
|
131
|
-
content: {
|
|
132
|
-
myInsertion: "Hola, mi nombre es {{name}} y tengo {{age}} años.",
|
|
133
|
-
},
|
|
134
|
-
};
|
|
135
|
-
|
|
136
|
-
module.exports = myInsertionContent;
|
|
137
|
-
```
|
|
138
|
-
|
|
139
87
|
```json5 fileName="**/*.content.json" contentDeclarationFormat="json"
|
|
140
88
|
{
|
|
141
89
|
"$schema": "https://intlayer.org/schema.json",
|
|
@@ -175,22 +175,70 @@ export default appContent;
|
|
|
175
175
|
Puedes consumir los diccionarios directamente en tus archivos `.astro` utilizando los helpers core exportados por `intlayer`.
|
|
176
176
|
|
|
177
177
|
```astro fileName="src/pages/index.astro"
|
|
178
|
-
<!-- astro -->
|
|
179
178
|
---
|
|
180
|
-
import {
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
179
|
+
import {
|
|
180
|
+
getIntlayer,
|
|
181
|
+
getLocaleFromPath,
|
|
182
|
+
getLocalizedUrl,
|
|
183
|
+
defaultLocale,
|
|
184
|
+
localeMap,
|
|
185
|
+
getHTMLTextDir,
|
|
186
|
+
type LocalesValues,
|
|
187
|
+
} from "intlayer";
|
|
188
|
+
import LocaleSwitcher from "../components/LocaleSwitcher.astro";
|
|
189
|
+
|
|
190
|
+
// Get the current locale from the URL (e.g. /es/about -> 'es')
|
|
191
|
+
const locale = getLocaleFromPath(Astro.url.pathname) as LocalesValues;
|
|
192
|
+
|
|
193
|
+
// Get the content for the 'app' dictionary
|
|
194
|
+
const { title } = getIntlayer("app", locale);
|
|
184
195
|
---
|
|
185
196
|
|
|
186
|
-
|
|
197
|
+
<!doctype html>
|
|
198
|
+
<html lang={locale} dir={getHTMLTextDir(locale)}>
|
|
187
199
|
<head>
|
|
188
200
|
<meta charset="utf-8" />
|
|
189
201
|
<meta name="viewport" content="width=device-width" />
|
|
202
|
+
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
190
203
|
<title>{title}</title>
|
|
204
|
+
|
|
205
|
+
<!-- Canonical link: Tells search engines which is the primary version of this page -->
|
|
206
|
+
<link
|
|
207
|
+
rel="canonical"
|
|
208
|
+
href={new URL(getLocalizedUrl(Astro.url.pathname, locale), Astro.site)}
|
|
209
|
+
/>
|
|
210
|
+
|
|
211
|
+
<!-- Hreflang: Tell Google about all localized versions -->
|
|
212
|
+
{
|
|
213
|
+
localeMap(({ locale: mapLocale }) => (
|
|
214
|
+
<link
|
|
215
|
+
rel="alternate"
|
|
216
|
+
hreflang={mapLocale}
|
|
217
|
+
href={new URL(
|
|
218
|
+
getLocalizedUrl(Astro.url.pathname, mapLocale),
|
|
219
|
+
Astro.site
|
|
220
|
+
)}
|
|
221
|
+
/>
|
|
222
|
+
))
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
<!-- x-default: Fallback for users in unmatched languages -->
|
|
226
|
+
<link
|
|
227
|
+
rel="alternate"
|
|
228
|
+
hreflang="x-default"
|
|
229
|
+
href={new URL(
|
|
230
|
+
getLocalizedUrl(Astro.url.pathname, defaultLocale),
|
|
231
|
+
Astro.site
|
|
232
|
+
)}
|
|
233
|
+
/>
|
|
191
234
|
</head>
|
|
192
235
|
<body>
|
|
193
|
-
<
|
|
236
|
+
<header>
|
|
237
|
+
<LocaleSwitcher />
|
|
238
|
+
</header>
|
|
239
|
+
<main>
|
|
240
|
+
<h1>{title}</h1>
|
|
241
|
+
</main>
|
|
194
242
|
</body>
|
|
195
243
|
</html>
|
|
196
244
|
```
|
|
@@ -421,29 +421,6 @@ const metadataContent = {
|
|
|
421
421
|
export default metadataContent;
|
|
422
422
|
```
|
|
423
423
|
|
|
424
|
-
```javascript fileName="src/app/[locale]/metadata.content.cjs" contentDeclarationFormat="commonjs"
|
|
425
|
-
const { t } = require("intlayer");
|
|
426
|
-
|
|
427
|
-
/** @type {import('intlayer').Dictionary<import('next').Metadata>} */
|
|
428
|
-
const metadataContent = {
|
|
429
|
-
key: "page-metadata",
|
|
430
|
-
content: {
|
|
431
|
-
title: t({
|
|
432
|
-
en: "Create Next App",
|
|
433
|
-
fr: "Créer une application Next.js",
|
|
434
|
-
es: "Crear una aplicación Next.js",
|
|
435
|
-
}),
|
|
436
|
-
description: t({
|
|
437
|
-
en: "Generated by create next app",
|
|
438
|
-
fr: "Généré par create next app",
|
|
439
|
-
es: "Generado por create next app",
|
|
440
|
-
}),
|
|
441
|
-
},
|
|
442
|
-
};
|
|
443
|
-
|
|
444
|
-
module.exports = metadataContent;
|
|
445
|
-
```
|
|
446
|
-
|
|
447
424
|
```json fileName="src/app/[locale]/metadata.content.json" contentDeclarationFormat="json"
|
|
448
425
|
{
|
|
449
426
|
"key": "page-metadata",
|
|
@@ -463,29 +463,6 @@ const metadataContent = {
|
|
|
463
463
|
export default metadataContent;
|
|
464
464
|
```
|
|
465
465
|
|
|
466
|
-
```javascript fileName="src/app/[locale]/metadata.content.cjs" contentDeclarationFormat="commonjs"
|
|
467
|
-
const { t } = require("intlayer");
|
|
468
|
-
|
|
469
|
-
/** @type {import('intlayer').Dictionary<import('next').Metadata>} */
|
|
470
|
-
const metadataContent = {
|
|
471
|
-
key: "page-metadata",
|
|
472
|
-
content: {
|
|
473
|
-
title: t({
|
|
474
|
-
en: "Create Next App",
|
|
475
|
-
fr: "Créer une application Next.js",
|
|
476
|
-
es: "Crear una aplicación Next.js",
|
|
477
|
-
}),
|
|
478
|
-
description: t({
|
|
479
|
-
en: "Generated by create next app",
|
|
480
|
-
fr: "Généré par create next app",
|
|
481
|
-
es: "Generado por create next app",
|
|
482
|
-
}),
|
|
483
|
-
},
|
|
484
|
-
};
|
|
485
|
-
|
|
486
|
-
module.exports = metadataContent;
|
|
487
|
-
```
|
|
488
|
-
|
|
489
466
|
```json fileName="src/app/[locale]/metadata.content.json" contentDeclarationFormat="json"
|
|
490
467
|
{
|
|
491
468
|
"key": "page-metadata",
|
|
@@ -110,58 +110,6 @@ const clientComponentContent = {
|
|
|
110
110
|
export default clientComponentContent;
|
|
111
111
|
```
|
|
112
112
|
|
|
113
|
-
```jsx fileName="src/ClientComponent/index.content.mjs" contentDeclarationFormat="esm"
|
|
114
|
-
import { t } from "intlayer";
|
|
115
|
-
|
|
116
|
-
/** @type {import('intlayer').Dictionary} */
|
|
117
|
-
const clientComponentContent = {
|
|
118
|
-
key: "client-component",
|
|
119
|
-
content: {
|
|
120
|
-
myTranslatedContent: t({
|
|
121
|
-
en: "Hello World",
|
|
122
|
-
es: "Hola Mundo",
|
|
123
|
-
fr: "Bonjour le monde",
|
|
124
|
-
}),
|
|
125
|
-
numberOfCar: enu({
|
|
126
|
-
"<-1": "Menos que menos un coche",
|
|
127
|
-
"-1": "Menos un coche",
|
|
128
|
-
"0": "Sin coches",
|
|
129
|
-
"1": "Un coche",
|
|
130
|
-
">5": "Algunos coches",
|
|
131
|
-
">19": "Muchos coches",
|
|
132
|
-
}),
|
|
133
|
-
},
|
|
134
|
-
};
|
|
135
|
-
|
|
136
|
-
export default clientComponentContent;
|
|
137
|
-
```
|
|
138
|
-
|
|
139
|
-
```jsx fileName="src/ClientComponent/index.content.cjs" contentDeclarationFormat="commonjs"
|
|
140
|
-
const { t } = require("intlayer");
|
|
141
|
-
|
|
142
|
-
/** @type {import('intlayer').Dictionary} */
|
|
143
|
-
const clientComponentContent = {
|
|
144
|
-
key: "client-component",
|
|
145
|
-
content: {
|
|
146
|
-
myTranslatedContent: t({
|
|
147
|
-
en: "Hello World",
|
|
148
|
-
es: "Hola Mundo",
|
|
149
|
-
fr: "Bonjour le monde",
|
|
150
|
-
}),
|
|
151
|
-
numberOfCar: enu({
|
|
152
|
-
"<-1": "Menos que menos un coche",
|
|
153
|
-
"-1": "Menos un coche",
|
|
154
|
-
"0": "Sin coches",
|
|
155
|
-
"1": "Un coche",
|
|
156
|
-
">5": "Algunos coches",
|
|
157
|
-
">19": "Muchos coches",
|
|
158
|
-
}),
|
|
159
|
-
},
|
|
160
|
-
};
|
|
161
|
-
|
|
162
|
-
module.exports = clientComponentContent;
|
|
163
|
-
```
|
|
164
|
-
|
|
165
113
|
```json fileName="src/ClientComponent/index.content.json" codeFormat="json"
|
|
166
114
|
{
|
|
167
115
|
"key": "client-component",
|
|
@@ -110,58 +110,6 @@ const component1Content = {
|
|
|
110
110
|
export default component1Content;
|
|
111
111
|
```
|
|
112
112
|
|
|
113
|
-
```jsx fileName="src/Component1/index.content.mjs" contentDeclarationFormat="esm"
|
|
114
|
-
import { t } from "intlayer";
|
|
115
|
-
|
|
116
|
-
/** @type {import('intlayer').Dictionary} */
|
|
117
|
-
const component1Content = {
|
|
118
|
-
key: "component-1",
|
|
119
|
-
content: {
|
|
120
|
-
myTranslatedContent: t({
|
|
121
|
-
en: "Hola Mundo",
|
|
122
|
-
fr: "Bonjour le monde",
|
|
123
|
-
es: "Hola Mundo",
|
|
124
|
-
}),
|
|
125
|
-
numberOfCar: enu({
|
|
126
|
-
"<-1": "Menos de menos un coche",
|
|
127
|
-
"-1": "Menos un coche",
|
|
128
|
-
"0": "Sin coches",
|
|
129
|
-
"1": "Un coche",
|
|
130
|
-
">5": "Algunos coches",
|
|
131
|
-
">19": "Muchos coches",
|
|
132
|
-
}),
|
|
133
|
-
},
|
|
134
|
-
};
|
|
135
|
-
|
|
136
|
-
export default component1Content;
|
|
137
|
-
```
|
|
138
|
-
|
|
139
|
-
```jsx fileName="src/Component1/index.content.cjs" contentDeclarationFormat="commonjs"
|
|
140
|
-
const { t } = require("intlayer");
|
|
141
|
-
|
|
142
|
-
/** @type {import('intlayer').Dictionary} */
|
|
143
|
-
const component1Content = {
|
|
144
|
-
key: "component-1",
|
|
145
|
-
content: {
|
|
146
|
-
myTranslatedContent: t({
|
|
147
|
-
en: "Hola Mundo",
|
|
148
|
-
fr: "Bonjour le monde",
|
|
149
|
-
es: "Hola Mundo",
|
|
150
|
-
}),
|
|
151
|
-
numberOfCar: enu({
|
|
152
|
-
"<-1": "Menos de menos un coche",
|
|
153
|
-
"-1": "Menos un coche",
|
|
154
|
-
"0": "Sin coches",
|
|
155
|
-
"1": "Un coche",
|
|
156
|
-
">5": "Algunos coches",
|
|
157
|
-
">19": "Muchos coches",
|
|
158
|
-
}),
|
|
159
|
-
},
|
|
160
|
-
};
|
|
161
|
-
|
|
162
|
-
module.exports = component1Content;
|
|
163
|
-
```
|
|
164
|
-
|
|
165
113
|
```json fileName="src/Component1/index.content.json" codeFormat="json"
|
|
166
114
|
{
|
|
167
115
|
"key": "component-1",
|
|
@@ -145,49 +145,6 @@ const helloWorldContent = {
|
|
|
145
145
|
export default helloWorldContent;
|
|
146
146
|
```
|
|
147
147
|
|
|
148
|
-
```tsx fileName="hello-world.es.content.mjs" contentDeclarationFormat="esm"
|
|
149
|
-
import { t, Locales } from "intlayer";
|
|
150
|
-
|
|
151
|
-
/** @type {import('intlayer').Dictionary} */
|
|
152
|
-
const helloWorldContent = {
|
|
153
|
-
key: "hello-world",
|
|
154
|
-
locale: Locales.SPANISH, // Importante
|
|
155
|
-
content: { multilingualContent: "Título de mi componente" },
|
|
156
|
-
};
|
|
157
|
-
|
|
158
|
-
export default helloWorldContent;
|
|
159
|
-
```
|
|
160
|
-
|
|
161
|
-
```js fileName="hello-world.en.content.cjs" contentDeclarationFormat="commonjs"
|
|
162
|
-
const { t, Locales } = require("intlayer");
|
|
163
|
-
|
|
164
|
-
/** @type {import('intlayer').Dictionary} */
|
|
165
|
-
const helloWorldContent = {
|
|
166
|
-
key: "hello-world",
|
|
167
|
-
locale: Locales.ENGLISH, // Importante
|
|
168
|
-
content: {
|
|
169
|
-
multilingualContent: "Título de mi componente",
|
|
170
|
-
},
|
|
171
|
-
};
|
|
172
|
-
|
|
173
|
-
module.exports = helloWorldContent;
|
|
174
|
-
```
|
|
175
|
-
|
|
176
|
-
```tsx fileName="hello-world.es.content.cjs" contentDeclarationFormat="commonjs"
|
|
177
|
-
const { t, Locales } = require("intlayer");
|
|
178
|
-
|
|
179
|
-
/** @type {import('intlayer').Dictionary} */
|
|
180
|
-
const helloWorldContent = {
|
|
181
|
-
key: "hello-world",
|
|
182
|
-
locale: Locales.SPANISH, // Importante
|
|
183
|
-
content: {
|
|
184
|
-
multilingualContent: "Título de mi componente",
|
|
185
|
-
},
|
|
186
|
-
};
|
|
187
|
-
|
|
188
|
-
module.exports = helloWorldContent;
|
|
189
|
-
```
|
|
190
|
-
|
|
191
148
|
```json5 fileName="hello-world.en.content.json" contentDeclarationFormat="json"
|
|
192
149
|
{
|
|
193
150
|
"$schema": "https://intlayer.org/schema.json",
|
|
@@ -54,34 +54,6 @@ Pour configurer le contenu d'insertion dans votre projet Intlayer, créez un mod
|
|
|
54
54
|
export default myInsertionContent;
|
|
55
55
|
```
|
|
56
56
|
|
|
57
|
-
```javascript fileName="**/*.content.mjs" contentDeclarationFormat="esm"
|
|
58
|
-
import { insert } from "intlayer";
|
|
59
|
-
|
|
60
|
-
/** @type {import('intlayer').Dictionary} */
|
|
61
|
-
const myInsertionContent = {
|
|
62
|
-
key: "my_key",
|
|
63
|
-
content: {
|
|
64
|
-
myInsertion: insert("Bonjour, je m'appelle {{name}} et j'ai {{age}} ans !"),
|
|
65
|
-
},
|
|
66
|
-
};
|
|
67
|
-
|
|
68
|
-
export default myInsertionContent;
|
|
69
|
-
```
|
|
70
|
-
|
|
71
|
-
```javascript fileName="**/*.content.cjs" contentDeclarationFormat="commonjs"
|
|
72
|
-
const { insert } = require("intlayer");
|
|
73
|
-
|
|
74
|
-
/** @type {import('intlayer').Dictionary} */
|
|
75
|
-
const myInsertionContent = {
|
|
76
|
-
key: "my_key",
|
|
77
|
-
content: {
|
|
78
|
-
myInsertion: insert("Bonjour, je m'appelle {{name}} et j'ai {{age}} ans !"),
|
|
79
|
-
},
|
|
80
|
-
};
|
|
81
|
-
|
|
82
|
-
module.exports = myInsertionContent;
|
|
83
|
-
```
|
|
84
|
-
|
|
85
57
|
```json5 fileName="**/*.content.json" contentDeclarationFormat="json"
|
|
86
58
|
{
|
|
87
59
|
"$schema": "https://intlayer.org/schema.json",
|
|
@@ -112,30 +84,6 @@ Pour configurer le contenu d'insertion dans votre projet Intlayer, créez un mod
|
|
|
112
84
|
export default myInsertionContent;
|
|
113
85
|
```
|
|
114
86
|
|
|
115
|
-
```javascript fileName="**/*.content.mjs" contentDeclarationFormat="esm"
|
|
116
|
-
/** @type {import('intlayer').Dictionary} */
|
|
117
|
-
const myInsertionContent = {
|
|
118
|
-
key: "my_key",
|
|
119
|
-
content: {
|
|
120
|
-
myInsertion: "Bonjour, je m'appelle {{name}} et j'ai {{age}} ans !",
|
|
121
|
-
},
|
|
122
|
-
};
|
|
123
|
-
|
|
124
|
-
export default myInsertionContent;
|
|
125
|
-
```
|
|
126
|
-
|
|
127
|
-
```javascript fileName="**/*.content.cjs" contentDeclarationFormat="commonjs"
|
|
128
|
-
/** @type {import('intlayer').Dictionary} */
|
|
129
|
-
const myInsertionContent = {
|
|
130
|
-
key: "my_key",
|
|
131
|
-
content: {
|
|
132
|
-
myInsertion: "Bonjour, je m'appelle {{name}} et j'ai {{age}} ans !",
|
|
133
|
-
},
|
|
134
|
-
};
|
|
135
|
-
|
|
136
|
-
module.exports = myInsertionContent;
|
|
137
|
-
```
|
|
138
|
-
|
|
139
87
|
```json5 fileName="**/*.content.json" contentDeclarationFormat="json"
|
|
140
88
|
{
|
|
141
89
|
"$schema": "https://intlayer.org/schema.json",
|
|
@@ -175,22 +175,70 @@ export default appContent;
|
|
|
175
175
|
Vous pouvez consommer les dictionnaires directement dans vos fichiers `.astro` en utilisant les helpers de base exportés par `intlayer`.
|
|
176
176
|
|
|
177
177
|
```astro fileName="src/pages/index.astro"
|
|
178
|
-
<!-- astro -->
|
|
179
178
|
---
|
|
180
|
-
import {
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
179
|
+
import {
|
|
180
|
+
getIntlayer,
|
|
181
|
+
getLocaleFromPath,
|
|
182
|
+
getLocalizedUrl,
|
|
183
|
+
defaultLocale,
|
|
184
|
+
localeMap,
|
|
185
|
+
getHTMLTextDir,
|
|
186
|
+
type LocalesValues,
|
|
187
|
+
} from "intlayer";
|
|
188
|
+
import LocaleSwitcher from "../components/LocaleSwitcher.astro";
|
|
189
|
+
|
|
190
|
+
// Get the current locale from the URL (e.g. /es/about -> 'es')
|
|
191
|
+
const locale = getLocaleFromPath(Astro.url.pathname) as LocalesValues;
|
|
192
|
+
|
|
193
|
+
// Get the content for the 'app' dictionary
|
|
194
|
+
const { title } = getIntlayer("app", locale);
|
|
184
195
|
---
|
|
185
196
|
|
|
186
|
-
|
|
197
|
+
<!doctype html>
|
|
198
|
+
<html lang={locale} dir={getHTMLTextDir(locale)}>
|
|
187
199
|
<head>
|
|
188
200
|
<meta charset="utf-8" />
|
|
189
201
|
<meta name="viewport" content="width=device-width" />
|
|
202
|
+
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
190
203
|
<title>{title}</title>
|
|
204
|
+
|
|
205
|
+
<!-- Canonical link: Tells search engines which is the primary version of this page -->
|
|
206
|
+
<link
|
|
207
|
+
rel="canonical"
|
|
208
|
+
href={new URL(getLocalizedUrl(Astro.url.pathname, locale), Astro.site)}
|
|
209
|
+
/>
|
|
210
|
+
|
|
211
|
+
<!-- Hreflang: Tell Google about all localized versions -->
|
|
212
|
+
{
|
|
213
|
+
localeMap(({ locale: mapLocale }) => (
|
|
214
|
+
<link
|
|
215
|
+
rel="alternate"
|
|
216
|
+
hreflang={mapLocale}
|
|
217
|
+
href={new URL(
|
|
218
|
+
getLocalizedUrl(Astro.url.pathname, mapLocale),
|
|
219
|
+
Astro.site
|
|
220
|
+
)}
|
|
221
|
+
/>
|
|
222
|
+
))
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
<!-- x-default: Fallback for users in unmatched languages -->
|
|
226
|
+
<link
|
|
227
|
+
rel="alternate"
|
|
228
|
+
hreflang="x-default"
|
|
229
|
+
href={new URL(
|
|
230
|
+
getLocalizedUrl(Astro.url.pathname, defaultLocale),
|
|
231
|
+
Astro.site
|
|
232
|
+
)}
|
|
233
|
+
/>
|
|
191
234
|
</head>
|
|
192
235
|
<body>
|
|
193
|
-
<
|
|
236
|
+
<header>
|
|
237
|
+
<LocaleSwitcher />
|
|
238
|
+
</header>
|
|
239
|
+
<main>
|
|
240
|
+
<h1>{title}</h1>
|
|
241
|
+
</main>
|
|
194
242
|
</body>
|
|
195
243
|
</html>
|
|
196
244
|
```
|