@intlayer/docs 7.0.5 → 7.0.6
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/blog/ar/intlayer_with_i18next.md +72 -19
- package/blog/ar/intlayer_with_next-i18next.md +61 -36
- package/blog/ar/intlayer_with_next-intl.md +61 -13
- package/blog/ar/intlayer_with_react-i18next.md +67 -18
- package/blog/ar/intlayer_with_react-intl.md +66 -13
- package/blog/ar/intlayer_with_vue-i18n.md +180 -0
- package/blog/de/intlayer_with_i18next.md +61 -26
- package/blog/de/intlayer_with_next-i18next.md +66 -17
- package/blog/de/intlayer_with_next-intl.md +62 -13
- package/blog/de/intlayer_with_react-i18next.md +66 -17
- package/blog/de/intlayer_with_react-intl.md +66 -14
- package/blog/de/intlayer_with_vue-i18n.md +178 -0
- package/blog/en/intlayer_with_i18next.md +53 -2
- package/blog/en/intlayer_with_next-i18next.md +52 -16
- package/blog/en/intlayer_with_next-intl.md +49 -0
- package/blog/en/intlayer_with_react-i18next.md +50 -1
- package/blog/en/intlayer_with_react-intl.md +53 -0
- package/blog/en/intlayer_with_vue-i18n.md +178 -0
- package/blog/en-GB/intlayer_with_i18next.md +58 -7
- package/blog/en-GB/intlayer_with_next-i18next.md +55 -9
- package/blog/en-GB/intlayer_with_next-intl.md +55 -6
- package/blog/en-GB/intlayer_with_react-i18next.md +55 -6
- package/blog/en-GB/intlayer_with_react-intl.md +56 -3
- package/blog/en-GB/intlayer_with_vue-i18n.md +180 -0
- package/blog/es/intlayer_with_i18next.md +69 -18
- package/blog/es/intlayer_with_next-i18next.md +70 -24
- package/blog/es/intlayer_with_next-intl.md +64 -13
- package/blog/es/intlayer_with_react-i18next.md +61 -12
- package/blog/es/intlayer_with_react-intl.md +65 -12
- package/blog/es/intlayer_with_vue-i18n.md +178 -0
- package/blog/fr/intlayer_with_i18next.md +77 -16
- package/blog/fr/intlayer_with_next-i18next.md +55 -31
- package/blog/fr/intlayer_with_next-intl.md +57 -7
- package/blog/fr/intlayer_with_react-i18next.md +64 -7
- package/blog/fr/intlayer_with_react-intl.md +63 -10
- package/blog/fr/intlayer_with_vue-i18n.md +178 -0
- package/blog/hi/intlayer_with_i18next.md +67 -16
- package/blog/hi/intlayer_with_next-i18next.md +69 -23
- package/blog/hi/intlayer_with_next-intl.md +61 -8
- package/blog/hi/intlayer_with_react-i18next.md +63 -14
- package/blog/hi/intlayer_with_react-intl.md +66 -13
- package/blog/hi/intlayer_with_vue-i18n.md +180 -0
- package/blog/id/intlayer_with_i18next.md +65 -14
- package/blog/id/intlayer_with_next-i18next.md +58 -12
- package/blog/id/intlayer_with_next-intl.md +60 -11
- package/blog/id/intlayer_with_react-i18next.md +59 -10
- package/blog/id/intlayer_with_react-intl.md +66 -13
- package/blog/id/intlayer_with_vue-i18n.md +178 -0
- package/blog/it/intlayer_with_i18next.md +70 -19
- package/blog/it/intlayer_with_next-i18next.md +68 -22
- package/blog/it/intlayer_with_next-intl.md +62 -12
- package/blog/it/intlayer_with_react-i18next.md +65 -16
- package/blog/it/intlayer_with_react-intl.md +67 -14
- package/blog/it/intlayer_with_vue-i18n.md +178 -0
- package/blog/ja/intlayer_with_i18next.md +74 -24
- package/blog/ja/intlayer_with_next-i18next.md +60 -37
- package/blog/ja/intlayer_with_next-intl.md +63 -15
- package/blog/ja/intlayer_with_react-i18next.md +70 -21
- package/blog/ja/intlayer_with_react-intl.md +73 -21
- package/blog/ja/intlayer_with_vue-i18n.md +180 -0
- package/blog/ko/intlayer_with_i18next.md +60 -29
- package/blog/ko/intlayer_with_next-i18next.md +59 -32
- package/blog/ko/intlayer_with_next-intl.md +52 -23
- package/blog/ko/intlayer_with_react-i18next.md +65 -16
- package/blog/ko/intlayer_with_react-intl.md +74 -22
- package/blog/ko/intlayer_with_vue-i18n.md +180 -0
- package/blog/pl/intlayer_with_i18next.md +63 -12
- package/blog/pl/intlayer_with_next-i18next.md +74 -17
- package/blog/pl/intlayer_with_next-intl.md +59 -8
- package/blog/pl/intlayer_with_react-i18next.md +59 -10
- package/blog/pl/intlayer_with_react-intl.md +65 -12
- package/blog/pl/intlayer_with_vue-i18n.md +180 -0
- package/blog/pt/intlayer_with_i18next.md +67 -16
- package/blog/pt/intlayer_with_next-i18next.md +65 -19
- package/blog/pt/intlayer_with_next-intl.md +62 -12
- package/blog/pt/intlayer_with_react-i18next.md +67 -18
- package/blog/pt/intlayer_with_react-intl.md +62 -10
- package/blog/pt/intlayer_with_vue-i18n.md +178 -0
- package/blog/ru/intlayer_with_i18next.md +68 -15
- package/blog/ru/intlayer_with_next-i18next.md +71 -25
- package/blog/ru/intlayer_with_next-intl.md +56 -7
- package/blog/ru/intlayer_with_react-i18next.md +65 -16
- package/blog/ru/intlayer_with_react-intl.md +69 -16
- package/blog/ru/intlayer_with_vue-i18n.md +180 -0
- package/blog/tr/intlayer_with_i18next.md +67 -16
- package/blog/tr/intlayer_with_next-i18next.md +78 -21
- package/blog/tr/intlayer_with_next-intl.md +69 -18
- package/blog/tr/intlayer_with_react-i18next.md +65 -16
- package/blog/tr/intlayer_with_react-intl.md +71 -19
- package/blog/tr/intlayer_with_vue-i18n.md +180 -0
- package/blog/vi/intlayer_with_i18next.md +64 -13
- package/blog/vi/intlayer_with_next-i18next.md +72 -26
- package/blog/vi/intlayer_with_next-intl.md +62 -11
- package/blog/vi/intlayer_with_react-i18next.md +66 -17
- package/blog/vi/intlayer_with_react-intl.md +70 -17
- package/blog/vi/intlayer_with_vue-i18n.md +180 -0
- package/blog/zh/intlayer_with_i18next.md +67 -17
- package/blog/zh/intlayer_with_next-i18next.md +67 -22
- package/blog/zh/intlayer_with_next-intl.md +61 -13
- package/blog/zh/intlayer_with_react-i18next.md +67 -18
- package/blog/zh/intlayer_with_react-intl.md +69 -17
- package/blog/zh/intlayer_with_vue-i18n.md +180 -0
- package/dist/cjs/generated/blog.entry.cjs +19 -0
- package/dist/cjs/generated/blog.entry.cjs.map +1 -1
- package/dist/esm/generated/blog.entry.mjs +19 -0
- package/dist/esm/generated/blog.entry.mjs.map +1 -1
- package/dist/types/generated/blog.entry.d.ts +1 -0
- package/dist/types/generated/blog.entry.d.ts.map +1 -1
- package/docs/ar/intlayer_with_nextjs_15.md +36 -9
- package/docs/ar/intlayer_with_nextjs_16.md +36 -9
- package/docs/de/intlayer_with_nextjs_15.md +36 -9
- package/docs/de/intlayer_with_nextjs_16.md +24 -6
- package/docs/en/intlayer_with_nextjs_14.md +37 -9
- package/docs/en/intlayer_with_nextjs_15.md +40 -10
- package/docs/en/intlayer_with_nextjs_16.md +40 -10
- package/docs/en/plugins/sync-json.md +152 -55
- package/docs/en/releases/v7.md +1 -1
- package/docs/en-GB/intlayer_with_nextjs_15.md +36 -9
- package/docs/en-GB/intlayer_with_nextjs_16.md +36 -9
- package/docs/en-GB/releases/v7.md +1 -1
- package/docs/es/intlayer_with_nextjs_15.md +36 -9
- package/docs/es/intlayer_with_nextjs_16.md +36 -9
- package/docs/fr/intlayer_with_nextjs_15.md +36 -9
- package/docs/fr/intlayer_with_nextjs_16.md +37 -24
- package/docs/hi/intlayer_with_nextjs_15.md +36 -9
- package/docs/hi/intlayer_with_nextjs_16.md +36 -9
- package/docs/id/intlayer_with_nextjs_16.md +36 -9
- package/docs/it/intlayer_with_nextjs_15.md +36 -9
- package/docs/it/intlayer_with_nextjs_16.md +36 -9
- package/docs/ja/intlayer_with_nextjs_15.md +36 -9
- package/docs/ja/intlayer_with_nextjs_16.md +36 -9
- package/docs/ko/intlayer_with_nextjs_15.md +36 -9
- package/docs/ko/intlayer_with_nextjs_16.md +36 -9
- package/docs/pl/intlayer_with_nextjs_16.md +36 -9
- package/docs/pt/intlayer_with_nextjs_15.md +36 -9
- package/docs/pt/intlayer_with_nextjs_16.md +36 -9
- package/docs/ru/intlayer_with_nextjs_15.md +36 -9
- package/docs/ru/intlayer_with_nextjs_16.md +36 -9
- package/docs/tr/intlayer_with_nextjs_15.md +36 -9
- package/docs/tr/intlayer_with_nextjs_16.md +39 -21
- package/docs/vi/intlayer_with_nextjs_16.md +36 -9
- package/docs/zh/intlayer_with_nextjs_15.md +36 -9
- package/docs/zh/intlayer_with_nextjs_16.md +36 -9
- package/package.json +14 -14
- package/src/generated/blog.entry.ts +19 -0
|
@@ -0,0 +1,180 @@
|
|
|
1
|
+
---
|
|
2
|
+
createdAt: 2025-08-23
|
|
3
|
+
updatedAt: 2025-10-29
|
|
4
|
+
title: Intlayer и vue-i18n
|
|
5
|
+
description: Интеграция Intlayer с vue-i18n для комплексного решения интернационализации Vue.js
|
|
6
|
+
keywords:
|
|
7
|
+
- vue-i18n
|
|
8
|
+
- Intlayer
|
|
9
|
+
- Интернационализация
|
|
10
|
+
- Блог
|
|
11
|
+
- Vue.js
|
|
12
|
+
- Nuxt
|
|
13
|
+
- JavaScript
|
|
14
|
+
- Vue
|
|
15
|
+
slugs:
|
|
16
|
+
- blog
|
|
17
|
+
- intlayer-with-vue-i18n
|
|
18
|
+
history:
|
|
19
|
+
- version: 7.0.6
|
|
20
|
+
date: 2025-11-01
|
|
21
|
+
changes: Добавлен плагин loadJSON
|
|
22
|
+
- version: 7.0.0
|
|
23
|
+
date: 2025-10-29
|
|
24
|
+
changes: Переход на плагин syncJSON и полное переписывание
|
|
25
|
+
---
|
|
26
|
+
|
|
27
|
+
# Интернационализация Vue.js (i18n) с vue-i18n и Intlayer
|
|
28
|
+
|
|
29
|
+
## Содержание
|
|
30
|
+
|
|
31
|
+
<TOC/>
|
|
32
|
+
|
|
33
|
+
## Что такое Intlayer?
|
|
34
|
+
|
|
35
|
+
**Intlayer** — это инновационная, с открытым исходным кодом библиотека интернационализации, разработанная для устранения недостатков традиционных решений i18n. Она предлагает современный подход к управлению контентом в приложениях Vue.js и Nuxt.
|
|
36
|
+
|
|
37
|
+
Смотрите конкретное сравнение с vue-i18n в нашем блоге [vue-i18n vs. Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/blog/ru/vue-i18n_vs_intlayer.md).
|
|
38
|
+
|
|
39
|
+
## Почему стоит сочетать Intlayer с vue-i18n?
|
|
40
|
+
|
|
41
|
+
Хотя Intlayer предоставляет отличное самостоятельное решение i18n (см. наше [руководство по интеграции с Vue.js](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ru/intlayer_with_vite+vue.md)), вы можете захотеть сочетать его с vue-i18n по нескольким причинам:
|
|
42
|
+
|
|
43
|
+
1. **Существующая кодовая база**: У вас уже есть реализованная система vue-i18n, и вы хотите постепенно перейти на улучшенный опыт разработки с Intlayer.
|
|
44
|
+
2. **Требования наследия**: Ваш проект требует совместимости с существующими плагинами или рабочими процессами vue-i18n.
|
|
45
|
+
3. **Знакомство команды**: Ваша команда привыкла к vue-i18n, но хочет улучшить управление контентом.
|
|
46
|
+
4. **Использование возможностей Intlayer**: Вы хотите использовать функции Intlayer, такие как декларация контента, автоматизация перевода, тестирование переводов и многое другое.
|
|
47
|
+
|
|
48
|
+
**Для этого Intlayer может быть реализован как адаптер для vue-i18n, чтобы помочь автоматизировать ваши JSON-переводы в CLI или CI/CD пайплайнах, тестировать переводы и многое другое.**
|
|
49
|
+
|
|
50
|
+
Это руководство показывает, как использовать превосходную систему декларации контента Intlayer, сохраняя при этом совместимость с vue-i18n.
|
|
51
|
+
|
|
52
|
+
---
|
|
53
|
+
|
|
54
|
+
## Пошаговое руководство по настройке Intlayer с vue-i18n
|
|
55
|
+
|
|
56
|
+
### Шаг 1: Установка зависимостей
|
|
57
|
+
|
|
58
|
+
Установите необходимые пакеты с помощью предпочитаемого менеджера пакетов:
|
|
59
|
+
|
|
60
|
+
```bash packageManager="npm"
|
|
61
|
+
npm install intlayer @intlayer/sync-json-plugin
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
```bash packageManager="pnpm"
|
|
65
|
+
pnpm add intlayer @intlayer/sync-json-plugin
|
|
66
|
+
```
|
|
67
|
+
|
|
68
|
+
```bash packageManager="yarn"
|
|
69
|
+
yarn add intlayer @intlayer/sync-json-plugin
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
```bash packageManager="bun"
|
|
73
|
+
bun add intlayer @intlayer/sync-json-plugin
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
**Объяснение пакетов:**
|
|
77
|
+
|
|
78
|
+
- **intlayer**: Основная библиотека для декларации и управления контентом
|
|
79
|
+
- **@intlayer/sync-json-plugin**: Плагин для синхронизации деклараций контента Intlayer с форматом JSON vue-i18n
|
|
80
|
+
|
|
81
|
+
### Шаг 2: Реализация плагина Intlayer для обёртки JSON
|
|
82
|
+
|
|
83
|
+
Создайте файл конфигурации Intlayer для определения поддерживаемых локалей:
|
|
84
|
+
|
|
85
|
+
**Если вы также хотите экспортировать JSON-словарь для vue-i18n**, добавьте плагин `syncJSON`:
|
|
86
|
+
|
|
87
|
+
```typescript fileName="intlayer.config.ts"
|
|
88
|
+
import { Locales, type IntlayerConfig } from "intlayer";
|
|
89
|
+
import { syncJSON } from "@intlayer/sync-json-plugin";
|
|
90
|
+
|
|
91
|
+
const config: IntlayerConfig = {
|
|
92
|
+
internationalization: {
|
|
93
|
+
locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
|
|
94
|
+
defaultLocale: Locales.ENGLISH,
|
|
95
|
+
},
|
|
96
|
+
plugins: [
|
|
97
|
+
syncJSON({
|
|
98
|
+
source: ({ key, locale }) => `./src/locales/${locale}/${key}.json`,
|
|
99
|
+
}),
|
|
100
|
+
],
|
|
101
|
+
};
|
|
102
|
+
|
|
103
|
+
export default config;
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
Плагин `syncJSON` автоматически обернет JSON. Он будет читать и записывать JSON-файлы без изменения архитектуры содержимого.
|
|
107
|
+
|
|
108
|
+
Если вы хотите, чтобы JSON сосуществовал с файлами деклараций контента Intlayer (`.content` файлы), Intlayer будет работать следующим образом:
|
|
109
|
+
|
|
110
|
+
1. загрузит как JSON, так и файлы деклараций контента и преобразует их в словарь Intlayer.
|
|
111
|
+
2. если возникнут конфликты между JSON и файлами деклараций контента, Intlayer выполнит слияние всех словарей. В зависимости от приоритета плагинов и файлов деклараций контента (все настраивается).
|
|
112
|
+
|
|
113
|
+
Если изменения вносятся с помощью CLI для перевода JSON или через CMS, Intlayer обновит JSON-файл с новыми переводами.
|
|
114
|
+
|
|
115
|
+
Чтобы узнать больше подробностей о плагине `syncJSON`, пожалуйста, обратитесь к [документации плагина syncJSON](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ru/plugins/sync-json.md).
|
|
116
|
+
|
|
117
|
+
---
|
|
118
|
+
|
|
119
|
+
### (Необязательно) Шаг 3: Реализация переводов JSON по компонентам
|
|
120
|
+
|
|
121
|
+
По умолчанию Intlayer загружает, объединяет и синхронизирует как JSON, так и файлы деклараций контента. Подробнее смотрите в [документации по декларации контента](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ru/dictionary/content_file.md). Но если вы предпочитаете, используя плагин Intlayer, вы также можете реализовать управление локализованным JSON по компонентам в любом месте вашего кода.
|
|
122
|
+
|
|
123
|
+
Для этого вы можете использовать плагин `loadJSON`.
|
|
124
|
+
|
|
125
|
+
```ts fileName="intlayer.config.ts"
|
|
126
|
+
import { Locales, type IntlayerConfig } from "intlayer";
|
|
127
|
+
import { loadJSON, syncJSON } from "@intlayer/sync-json-plugin";
|
|
128
|
+
|
|
129
|
+
const config: IntlayerConfig = {
|
|
130
|
+
internationalization: {
|
|
131
|
+
locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
|
|
132
|
+
defaultLocale: Locales.ENGLISH,
|
|
133
|
+
},
|
|
134
|
+
|
|
135
|
+
// Синхронизируйте ваши текущие JSON-файлы с словарями Intlayer
|
|
136
|
+
plugins: [
|
|
137
|
+
/**
|
|
138
|
+
* Загрузит все JSON-файлы в src, которые соответствуют шаблону {key}.i18n.json
|
|
139
|
+
*/
|
|
140
|
+
loadJSON({
|
|
141
|
+
source: ({ key }) => `./src/**/${key}.i18n.json`,
|
|
142
|
+
locale: Locales.ENGLISH,
|
|
143
|
+
priority: 1, // Обеспечивает приоритет этих JSON-файлов над файлами в `./locales/en/${key}.json`
|
|
144
|
+
}),
|
|
145
|
+
/**
|
|
146
|
+
* Загрузит, а также запишет результат и переводы обратно в JSON-файлы в директории locales
|
|
147
|
+
*/
|
|
148
|
+
syncJSON({
|
|
149
|
+
source: ({ key, locale }) => `./src/locales/${locale}/${key}.json`,
|
|
150
|
+
priority: 0,
|
|
151
|
+
}),
|
|
152
|
+
],
|
|
153
|
+
};
|
|
154
|
+
|
|
155
|
+
export default config;
|
|
156
|
+
```
|
|
157
|
+
|
|
158
|
+
Это загрузит все JSON-файлы в каталоге `src`, которые соответствуют шаблону `{key}.i18n.json`, и загрузит их как словари Intlayer.
|
|
159
|
+
|
|
160
|
+
---
|
|
161
|
+
|
|
162
|
+
## Конфигурация Git
|
|
163
|
+
|
|
164
|
+
Исключите сгенерированные файлы из системы контроля версий:
|
|
165
|
+
|
|
166
|
+
```plaintext fileName=".gitignore"
|
|
167
|
+
# Игнорировать файлы, сгенерированные Intlayer
|
|
168
|
+
.intlayer
|
|
169
|
+
intl
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
Эти файлы автоматически пересоздаются в процессе сборки и не требуют добавления в ваш репозиторий.
|
|
173
|
+
|
|
174
|
+
### Расширение VS Code
|
|
175
|
+
|
|
176
|
+
Для улучшения опыта разработчика установите официальное **расширение Intlayer для VS Code**:
|
|
177
|
+
|
|
178
|
+
[Установить из магазина расширений VS Code](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
|
|
179
|
+
|
|
180
|
+
[Установить из магазина расширений VS Code](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
createdAt: 2024-12-24
|
|
3
|
-
updatedAt: 2025-
|
|
4
|
-
title: i18next JSON çevirilerinizi Intlayer
|
|
3
|
+
updatedAt: 2025-11-01
|
|
4
|
+
title: i18next JSON çevirilerinizi Intlayer kullanarak nasıl otomatikleştirirsiniz
|
|
5
5
|
description: JavaScript uygulamalarında gelişmiş uluslararasılaştırma için Intlayer ve i18next ile JSON çevirilerinizi otomatikleştirin.
|
|
6
6
|
keywords:
|
|
7
7
|
- Intlayer
|
|
@@ -20,28 +20,32 @@ slugs:
|
|
|
20
20
|
- blog
|
|
21
21
|
- intlayer-with-i18next
|
|
22
22
|
history:
|
|
23
|
+
- version: 7.0.6
|
|
24
|
+
date: 2025-11-01
|
|
25
|
+
changes: loadJSON eklentisi eklendi
|
|
23
26
|
- version: 7.0.0
|
|
24
27
|
date: 2025-10-29
|
|
25
|
-
changes: syncJSON eklentisine
|
|
28
|
+
changes: syncJSON eklentisine geçildi
|
|
26
29
|
---
|
|
27
30
|
|
|
28
|
-
# i18next JSON çevirilerinizi Intlayer
|
|
31
|
+
# i18next JSON çevirilerinizi Intlayer kullanarak nasıl otomatikleştirirsiniz
|
|
29
32
|
|
|
30
33
|
## Intlayer nedir?
|
|
31
34
|
|
|
32
|
-
**Intlayer**, geleneksel i18n çözümlerinin eksikliklerini gidermek için tasarlanmış yenilikçi, açık kaynaklı bir uluslararasılaştırma kütüphanesidir. JavaScript uygulamalarında içerik
|
|
35
|
+
**Intlayer**, geleneksel i18n çözümlerinin eksikliklerini gidermek için tasarlanmış yenilikçi, açık kaynaklı bir uluslararasılaştırma kütüphanesidir. JavaScript uygulamalarında içerik yönetimi için modern bir yaklaşım sunar.
|
|
33
36
|
|
|
34
37
|
i18next ile somut bir karşılaştırma için [next-i18next vs. next-intl vs. Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/blog/tr/next-i18next_vs_next-intl_vs_intlayer.md) blog yazımıza bakabilirsiniz.
|
|
35
38
|
|
|
36
39
|
## Neden Intlayer'ı i18next ile Birleştirmelisiniz?
|
|
37
40
|
|
|
38
|
-
Intlayer mükemmel bir bağımsız i18n çözümü sunarken (bakınız [Next.js entegrasyon rehberimiz](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/intlayer_with_nextjs_16.md)),
|
|
41
|
+
Intlayer mükemmel bir bağımsız i18n çözümü sunarken (bakınız [Next.js entegrasyon rehberimiz](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/intlayer_with_nextjs_16.md)), aşağıdaki nedenlerle i18next ile birleştirmek isteyebilirsiniz:
|
|
39
42
|
|
|
40
43
|
1. **Mevcut kod tabanı**: Yerleşik bir i18next uygulamanız var ve Intlayer'ın geliştirilmiş geliştirici deneyimine kademeli olarak geçmek istiyorsunuz.
|
|
41
44
|
2. **Eski gereksinimler**: Projeniz mevcut i18next eklentileri veya iş akışları ile uyumluluk gerektiriyor.
|
|
42
45
|
3. **Ekip aşinalığı**: Ekibiniz i18next ile rahat ancak daha iyi içerik yönetimi istiyor.
|
|
46
|
+
4. **Intlayer özelliklerini kullanmak**: İçerik beyanı, çeviri anahtarlarının yönetimi, çeviri durumu ve daha fazlası gibi Intlayer özelliklerini kullanmak istiyorsunuz.
|
|
43
47
|
|
|
44
|
-
**Bunun için, Intlayer
|
|
48
|
+
**Bunun için, Intlayer, JSON çevirilerinizi CLI veya CI/CD boru hatlarında otomatikleştirmeye, çevirilerinizi test etmeye ve daha fazlasına yardımcı olmak amacıyla i18next için bir adaptör olarak uygulanabilir.**
|
|
45
49
|
|
|
46
50
|
Bu rehber, Intlayer'ın üstün içerik beyan sistemi avantajlarından yararlanırken i18next ile uyumluluğu nasıl koruyacağınızı gösterir.
|
|
47
51
|
|
|
@@ -49,7 +53,7 @@ Bu rehber, Intlayer'ın üstün içerik beyan sistemi avantajlarından yararlan
|
|
|
49
53
|
|
|
50
54
|
<TOC/>
|
|
51
55
|
|
|
52
|
-
##
|
|
56
|
+
## Intlayer'ı i18next ile Kurmak için Adım Adım Rehber
|
|
53
57
|
|
|
54
58
|
### Adım 1: Bağımlılıkları Yükleyin
|
|
55
59
|
|
|
@@ -67,6 +71,10 @@ pnpm add intlayer @intlayer/sync-json-plugin
|
|
|
67
71
|
yarn add intlayer @intlayer/sync-json-plugin
|
|
68
72
|
```
|
|
69
73
|
|
|
74
|
+
```bash packageManager="bun"
|
|
75
|
+
bun add intlayer @intlayer/sync-json-plugin
|
|
76
|
+
```
|
|
77
|
+
|
|
70
78
|
**Paket açıklamaları:**
|
|
71
79
|
|
|
72
80
|
- **intlayer**: Uluslararasılaştırma yönetimi, içerik beyanı ve derleme için temel kütüphane
|
|
@@ -76,7 +84,7 @@ yarn add intlayer @intlayer/sync-json-plugin
|
|
|
76
84
|
|
|
77
85
|
Desteklenen yerel ayarları tanımlamak için bir Intlayer yapılandırma dosyası oluşturun:
|
|
78
86
|
|
|
79
|
-
**Ayrıca i18next için JSON
|
|
87
|
+
**Ayrıca i18next için JSON sözlüklerini dışa aktarmak istiyorsanız**, `syncJSON` eklentisini ekleyin:
|
|
80
88
|
|
|
81
89
|
```typescript fileName="intlayer.config.ts"
|
|
82
90
|
import { Locales, type IntlayerConfig } from "intlayer";
|
|
@@ -89,7 +97,7 @@ const config: IntlayerConfig = {
|
|
|
89
97
|
},
|
|
90
98
|
plugins: [
|
|
91
99
|
syncJSON({
|
|
92
|
-
source: ({ key, locale }) => `./
|
|
100
|
+
source: ({ key, locale }) => `./locales/${locale}/${key}.json`,
|
|
93
101
|
}),
|
|
94
102
|
],
|
|
95
103
|
};
|
|
@@ -99,12 +107,57 @@ export default config;
|
|
|
99
107
|
|
|
100
108
|
`syncJSON` eklentisi JSON'u otomatik olarak sarar. İçerik mimarisini değiştirmeden JSON dosyalarını okur ve yazar.
|
|
101
109
|
|
|
102
|
-
Eğer JSON dosyalarının intlayer içerik beyan dosyaları (`.content` dosyaları) ile birlikte var olmasını istiyorsanız, Intlayer şu şekilde ilerler:
|
|
110
|
+
Eğer bu JSON dosyalarının intlayer içerik beyan dosyaları (`.content` dosyaları) ile birlikte var olmasını istiyorsanız, Intlayer şu şekilde ilerler:
|
|
111
|
+
|
|
112
|
+
1. Hem JSON hem de içerik beyan dosyalarını yükler ve bunları bir intlayer sözlüğüne dönüştürür.
|
|
113
|
+
2. JSON ile içerik beyan dosyaları arasında çakışma varsa, Intlayer tüm sözlükleri birleştirir. Bu işlem, eklentilerin ve içerik beyan dosyasının önceliklerine bağlıdır (tüm öncelikler yapılandırılabilir).
|
|
114
|
+
|
|
115
|
+
JSON'u çevirmek için CLI veya CMS kullanılarak değişiklik yapılırsa, Intlayer JSON dosyasını yeni çevirilerle günceller.
|
|
103
116
|
|
|
104
|
-
|
|
105
|
-
2. JSON ile içerik beyan dosyaları arasında çakışma varsa, Intlayer tüm sözlükleri birleştirme işlemi yapar. Bu, eklentilerin önceliğine ve içerik beyan dosyasının önceliğine bağlıdır (hepsi yapılandırılabilir).
|
|
117
|
+
`syncJSON` eklentisi hakkında daha fazla detay görmek için lütfen [syncJSON eklenti dokümantasyonuna](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/plugins/sync-json.md) bakınız.
|
|
106
118
|
|
|
107
|
-
|
|
119
|
+
### (İsteğe Bağlı) Adım 3: Bileşen başına JSON çevirilerini uygulama
|
|
120
|
+
|
|
121
|
+
Varsayılan olarak, Intlayer hem JSON hem de içerik beyan dosyalarını yükler, birleştirir ve senkronize eder. Daha fazla detay için [içerik beyan dokümantasyonuna](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/dictionary/content_file.md) bakabilirsiniz. Ancak isterseniz, bir Intlayer eklentisi kullanarak, kod tabanınızın herhangi bir yerinde yerelleştirilmiş JSON’un bileşen başına yönetimini de uygulayabilirsiniz.
|
|
122
|
+
|
|
123
|
+
Bunun için `loadJSON` eklentisini kullanabilirsiniz.
|
|
124
|
+
|
|
125
|
+
```ts fileName="intlayer.config.ts"
|
|
126
|
+
import { Locales, type IntlayerConfig } from "intlayer";
|
|
127
|
+
import { loadJSON, syncJSON } from "@intlayer/sync-json-plugin";
|
|
128
|
+
|
|
129
|
+
const config: IntlayerConfig = {
|
|
130
|
+
internationalization: {
|
|
131
|
+
locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
|
|
132
|
+
defaultLocale: Locales.ENGLISH,
|
|
133
|
+
},
|
|
134
|
+
|
|
135
|
+
// Mevcut JSON dosyalarınızı Intlayer sözlükleri ile senkronize tutun
|
|
136
|
+
plugins: [
|
|
137
|
+
/**
|
|
138
|
+
* src içindeki {key}.i18n.json desenine uyan tüm JSON dosyalarını yükler
|
|
139
|
+
*/
|
|
140
|
+
loadJSON({
|
|
141
|
+
source: ({ key }) => `./src/**/${key}.i18n.json`,
|
|
142
|
+
locale: Locales.ENGLISH,
|
|
143
|
+
priority: 1, // Bu JSON dosyalarının `./locales/en/${key}.json` dosyalarından öncelikli olmasını sağlar
|
|
144
|
+
}),
|
|
145
|
+
/**
|
|
146
|
+
* locales dizinindeki JSON dosyalarını yükler ve çıktı ile çevirileri geri yazar
|
|
147
|
+
*/
|
|
148
|
+
syncJSON({
|
|
149
|
+
source: ({ key, locale }) => `./locales/${locale}/${key}.json`,
|
|
150
|
+
priority: 0,
|
|
151
|
+
}),
|
|
152
|
+
],
|
|
153
|
+
};
|
|
154
|
+
|
|
155
|
+
export default config;
|
|
156
|
+
```
|
|
157
|
+
|
|
158
|
+
Bu, `src` dizininde `{key}.i18n.json` desenine uyan tüm JSON dosyalarını yükleyecek ve bunları Intlayer sözlükleri olarak kullanacaktır.
|
|
159
|
+
|
|
160
|
+
---
|
|
108
161
|
|
|
109
162
|
## Git Yapılandırması
|
|
110
163
|
|
|
@@ -122,5 +175,3 @@ Bu dosyalar derleme süreciniz sırasında yeniden oluşturulabilir ve sürüm k
|
|
|
122
175
|
Geliştirici deneyimini iyileştirmek için resmi **Intlayer VS Code Eklentisi**ni yükleyin:
|
|
123
176
|
|
|
124
177
|
[VS Code Marketplace'ten Yükleyin](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
|
|
125
|
-
|
|
126
|
-
[VS Code Marketplace'ten Yükleyin](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
|
|
@@ -16,6 +16,9 @@ slugs:
|
|
|
16
16
|
- blog
|
|
17
17
|
- intlayer-with-next-i18next
|
|
18
18
|
history:
|
|
19
|
+
- version: 7.0.6
|
|
20
|
+
date: 2025-11-01
|
|
21
|
+
changes: loadJSON eklentisi eklendi
|
|
19
22
|
- version: 7.0.0
|
|
20
23
|
date: 2025-10-29
|
|
21
24
|
changes: syncJSON eklentisine geçiş ve kapsamlı yeniden yazım
|
|
@@ -36,15 +39,15 @@ Ancak, next-i18next bazı zorluklarla birlikte gelir:
|
|
|
36
39
|
- **Karmaşık yapılandırma**: next-i18next kurulumu, birden fazla yapılandırma dosyası gerektirir ve sunucu tarafı ile istemci tarafı i18n örneklerinin dikkatli kurulmasını gerektirir.
|
|
37
40
|
- **Dağınık çeviriler**: Çeviri dosyaları genellikle bileşenlerden ayrı dizinlerde saklanır, bu da tutarlılığı korumayı zorlaştırır.
|
|
38
41
|
- **Manuel isim alanı yönetimi**: Geliştiricilerin isim alanlarını manuel olarak yönetmesi ve çeviri kaynaklarının doğru şekilde yüklenmesini sağlaması gerekir.
|
|
39
|
-
|
|
42
|
+
/// **Sınırlı tür güvenliği**: TypeScript desteği ek yapılandırma gerektirir ve çeviriler için otomatik tür oluşturma sağlamaz.
|
|
40
43
|
|
|
41
44
|
## Intlayer Nedir?
|
|
42
45
|
|
|
43
|
-
**Intlayer**, geleneksel i18n çözümlerinin eksikliklerini gidermek için tasarlanmış yenilikçi, açık kaynaklı bir uluslararasılaştırma kütüphanesidir. Next.js uygulamalarında içerik
|
|
46
|
+
**Intlayer**, geleneksel i18n çözümlerinin eksikliklerini gidermek için tasarlanmış yenilikçi, açık kaynaklı bir uluslararasılaştırma kütüphanesidir. Next.js uygulamalarında içerik yönetimi için modern bir yaklaşım sunar.
|
|
44
47
|
|
|
45
|
-
next-intl ile somut bir karşılaştırma için [next-i18next vs. next-intl vs. Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/blog/
|
|
48
|
+
next-intl ile somut bir karşılaştırma için [next-i18next vs. next-intl vs. Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/blog/en/next-i18next_vs_next-intl_vs_intlayer.md) blog yazımıza bakabilirsiniz.
|
|
46
49
|
|
|
47
|
-
## Neden Intlayer
|
|
50
|
+
## Neden Intlayer'ı next-i18next ile Birleştirmelisiniz?
|
|
48
51
|
|
|
49
52
|
Intlayer mükemmel bir bağımsız i18n çözümü sunarken (bkz. [Next.js entegrasyon rehberimiz](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/intlayer_with_nextjs_16.md)), birkaç nedenle next-i18next ile birleştirmek isteyebilirsiniz:
|
|
50
53
|
|
|
@@ -52,13 +55,13 @@ Intlayer mükemmel bir bağımsız i18n çözümü sunarken (bkz. [Next.js enteg
|
|
|
52
55
|
2. **Eski gereksinimler**: Projeniz mevcut i18next eklentileri veya iş akışları ile uyumluluk gerektiriyor.
|
|
53
56
|
3. **Ekip aşinalığı**: Ekibiniz next-i18next ile rahat ancak daha iyi içerik yönetimi istiyor.
|
|
54
57
|
|
|
55
|
-
|
|
58
|
+
Bunun için, Intlayer, JSON çevirilerinizi CLI veya CI/CD boru hatlarında otomatikleştirmeye, çevirilerinizi test etmeye ve daha fazlasına yardımcı olmak için next-i18next için bir adaptör olarak uygulanabilir.
|
|
56
59
|
|
|
57
60
|
Bu rehber, Intlayer'ın üstün içerik beyan sistemi avantajlarından yararlanırken next-i18next ile uyumluluğu nasıl koruyacağınızı gösterir.
|
|
58
61
|
|
|
59
62
|
---
|
|
60
63
|
|
|
61
|
-
## Intlayer'ı next-i18next ile Kurmak
|
|
64
|
+
## Intlayer'ı next-i18next ile Kurmak İçin Adım Adım Rehber
|
|
62
65
|
|
|
63
66
|
### Adım 1: Bağımlılıkları Yükleyin
|
|
64
67
|
|
|
@@ -76,18 +79,18 @@ pnpm add intlayer @intlayer/sync-json-plugin
|
|
|
76
79
|
yarn add intlayer @intlayer/sync-json-plugin
|
|
77
80
|
```
|
|
78
81
|
|
|
82
|
+
```bash packageManager="bun"
|
|
83
|
+
bun add intlayer @intlayer/sync-json-plugin
|
|
84
|
+
```
|
|
85
|
+
|
|
79
86
|
**Paket açıklamaları:**
|
|
80
87
|
|
|
81
88
|
- **intlayer**: İçerik beyanı ve yönetimi için temel kütüphane
|
|
82
|
-
-
|
|
83
|
-
- **i18next**: Temel i18n çerçevesi
|
|
84
|
-
- **next-i18next**: i18next için Next.js sarmalayıcısı
|
|
85
|
-
- **i18next-resources-to-backend**: i18next için dinamik kaynak yükleme
|
|
86
|
-
- **@intlayer/sync-json-plugin**: Intlayer içerik beyanlarını i18next JSON formatına senkronize eden eklenti
|
|
89
|
+
- **@intlayer/sync-json-plugin**: Intlayer içerik beyanlarını i18next JSON formatına senkronize etmek için eklenti
|
|
87
90
|
|
|
88
91
|
### Adım 2: JSON'u sarmak için Intlayer eklentisini uygulayın
|
|
89
92
|
|
|
90
|
-
|
|
93
|
+
Desteklenen yerel ayarları tanımlamak için bir Intlayer yapılandırma dosyası oluşturun:
|
|
91
94
|
|
|
92
95
|
**Eğer i18next için JSON sözlüklerini de dışa aktarmak istiyorsanız**, `syncJSON` eklentisini ekleyin:
|
|
93
96
|
|
|
@@ -102,7 +105,18 @@ const config: IntlayerConfig = {
|
|
|
102
105
|
},
|
|
103
106
|
plugins: [
|
|
104
107
|
syncJSON({
|
|
105
|
-
|
|
108
|
+
typescript fileName="intlayer.config.ts"
|
|
109
|
+
import { Locales, type IntlayerConfig } from "intlayer";
|
|
110
|
+
import { syncJSON } from "@intlayer/sync-json-plugin";
|
|
111
|
+
|
|
112
|
+
const config: IntlayerConfig = {
|
|
113
|
+
internationalization: {
|
|
114
|
+
locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
|
|
115
|
+
defaultLocale: Locales.ENGLISH,
|
|
116
|
+
},
|
|
117
|
+
plugins: [
|
|
118
|
+
syncJSON({
|
|
119
|
+
source: ({ key, locale }) => `./public/locales/${locale}/${key}.json`,
|
|
106
120
|
}),
|
|
107
121
|
],
|
|
108
122
|
};
|
|
@@ -110,16 +124,59 @@ const config: IntlayerConfig = {
|
|
|
110
124
|
export default config;
|
|
111
125
|
```
|
|
112
126
|
|
|
113
|
-
`syncJSON` eklentisi JSON'u otomatik olarak saracaktır. İçerik mimarisini değiştirmeden JSON dosyalarını okuyup
|
|
127
|
+
`syncJSON` eklentisi JSON'u otomatik olarak saracaktır. İçerik mimarisini değiştirmeden JSON dosyalarını okuyup yazacaktır.
|
|
128
|
+
|
|
129
|
+
Eğer bu JSON'un intlayer içerik beyan dosyaları (`.content` dosyaları) ile birlikte var olmasını istiyorsanız, Intlayer şu şekilde ilerleyecektir:
|
|
130
|
+
|
|
131
|
+
1. Hem JSON hem de içerik beyan dosyalarını yükleyip bunları bir intlayer sözlüğüne dönüştürür.
|
|
132
|
+
2. JSON ile içerik beyan dosyaları arasında çakışma varsa, Intlayer tüm sözlükleri birleştirme işlemi yapar. Bu işlem, eklentilerin önceliğine ve içerik beyan dosyasının önceliğine bağlıdır (tümü yapılandırılabilir).
|
|
133
|
+
|
|
134
|
+
JSON'i çevirmek için CLI kullanılarak veya CMS kullanılarak değişiklikler yapılırsa, Intlayer yeni çevirilerle JSON dosyasını güncelleyecektir.
|
|
135
|
+
|
|
136
|
+
`syncJSON` eklentisi hakkında daha fazla ayrıntı için lütfen [syncJSON eklenti dokümantasyonuna](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/plugins/sync-json.md) bakınız.
|
|
137
|
+
|
|
138
|
+
---
|
|
139
|
+
|
|
140
|
+
### (İsteğe Bağlı) Adım 3: Bileşen başına JSON çevirilerini uygulama
|
|
141
|
+
|
|
142
|
+
Varsayılan olarak, Intlayer hem JSON hem de içerik beyan dosyalarını yükler, birleştirir ve senkronize eder. Daha fazla ayrıntı için [içerik beyan dokümantasyonuna](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/dictionary/content_file.md) bakınız. Ancak isterseniz, Intlayer eklentisi kullanarak, kod tabanınızın herhangi bir yerinde yerelleştirilmiş JSON'un bileşen bazında yönetimini de uygulayabilirsiniz.
|
|
143
|
+
|
|
144
|
+
Bunun için `loadJSON` eklentisini kullanabilirsiniz.
|
|
145
|
+
|
|
146
|
+
```ts fileName="intlayer.config.ts"
|
|
147
|
+
import { Locales, type IntlayerConfig } from "intlayer";
|
|
148
|
+
import { loadJSON, syncJSON } from "@intlayer/sync-json-plugin";
|
|
114
149
|
|
|
115
|
-
|
|
150
|
+
const config: IntlayerConfig = {
|
|
151
|
+
internationalization: {
|
|
152
|
+
locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
|
|
153
|
+
defaultLocale: Locales.ENGLISH,
|
|
154
|
+
},
|
|
116
155
|
|
|
117
|
-
|
|
118
|
-
|
|
156
|
+
// Mevcut JSON dosyalarınızı Intlayer sözlükleri ile senkronize tutun
|
|
157
|
+
plugins: [
|
|
158
|
+
/**
|
|
159
|
+
* src içindeki ve {key}.i18n.json desenine uyan tüm JSON dosyalarını yükler
|
|
160
|
+
*/
|
|
161
|
+
loadJSON({
|
|
162
|
+
source: ({ key }) => `./src/**/${key}.i18n.json`,
|
|
163
|
+
locale: Locales.ENGLISH,
|
|
164
|
+
priority: 1, // Bu JSON dosyalarının `./public/locales/en/${key}.json` dosyalarından öncelikli olmasını sağlar
|
|
165
|
+
}),
|
|
166
|
+
/**
|
|
167
|
+
* Yerel dizindeki JSON dosyalarına çıktıyı ve çevirileri geri yazacak ve yükleyecek
|
|
168
|
+
*/
|
|
169
|
+
syncJSON({
|
|
170
|
+
source: ({ key, locale }) => `./public/locales/${locale}/${key}.json`,
|
|
171
|
+
priority: 0,
|
|
172
|
+
}),
|
|
173
|
+
],
|
|
174
|
+
};
|
|
119
175
|
|
|
120
|
-
|
|
176
|
+
export default config;
|
|
177
|
+
```
|
|
121
178
|
|
|
122
|
-
`
|
|
179
|
+
Bu, `src` dizinindeki `{key}.i18n.json` desenine uyan tüm JSON dosyalarını yükleyecek ve bunları Intlayer sözlükleri olarak kullanacaktır.
|
|
123
180
|
|
|
124
181
|
---
|
|
125
182
|
|
|
@@ -133,10 +190,10 @@ Oluşturulan dosyaları sürüm kontrolünden hariç tutun:
|
|
|
133
190
|
intl
|
|
134
191
|
```
|
|
135
192
|
|
|
136
|
-
Bu dosyalar
|
|
193
|
+
Bu dosyalar derleme sürecinde otomatik olarak yeniden oluşturulur ve depoza gönderilmesine gerek yoktur.
|
|
137
194
|
|
|
138
195
|
### VS Code Eklentisi
|
|
139
196
|
|
|
140
|
-
Geliştirici deneyimini iyileştirmek için resmi **Intlayer VS Code
|
|
197
|
+
Geliştirici deneyimini iyileştirmek için resmi **Intlayer VS Code Uzantısı**nı yükleyin:
|
|
141
198
|
|
|
142
199
|
[VS Code Marketinden Yükleyin](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
|
|
@@ -7,28 +7,32 @@ slugs:
|
|
|
7
7
|
- blog
|
|
8
8
|
- intlayer-with-next-intl
|
|
9
9
|
history:
|
|
10
|
+
- version: 7.0.6
|
|
11
|
+
date: 2025-11-01
|
|
12
|
+
changes: loadJSON eklentisi eklendi
|
|
10
13
|
- version: 7.0.0
|
|
11
14
|
date: 2025-10-29
|
|
12
|
-
changes: syncJSON eklentisine
|
|
15
|
+
changes: syncJSON eklentisine geçildi
|
|
13
16
|
---
|
|
14
17
|
|
|
15
18
|
# Intlayer kullanarak next-intl JSON çevirilerinizi nasıl otomatikleştirirsiniz
|
|
16
19
|
|
|
17
20
|
## Intlayer nedir?
|
|
18
21
|
|
|
19
|
-
**Intlayer**, geleneksel i18n çözümlerinin eksikliklerini gidermek için tasarlanmış yenilikçi, açık kaynaklı bir uluslararasılaştırma kütüphanesidir. Next.js uygulamalarında içerik
|
|
22
|
+
**Intlayer**, geleneksel i18n çözümlerinin eksikliklerini gidermek için tasarlanmış yenilikçi, açık kaynaklı bir uluslararasılaştırma kütüphanesidir. Next.js uygulamalarında içerik yönetimi için modern bir yaklaşım sunar.
|
|
20
23
|
|
|
21
|
-
Next-intl ile somut bir karşılaştırma için [next-i18next vs. next-intl vs. Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/blog/
|
|
24
|
+
Next-intl ile somut bir karşılaştırma için [next-i18next vs. next-intl vs. Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/blog/en/next-i18next_vs_next-intl_vs_intlayer.md) blog yazımıza bakın.
|
|
22
25
|
|
|
23
26
|
## Neden Intlayer'ı next-intl ile Birleştirmelisiniz?
|
|
24
27
|
|
|
25
|
-
Intlayer mükemmel bir bağımsız i18n çözümü sunarken (bakınız [Next.js entegrasyon rehberimiz](https://github.com/aymericzip/intlayer/blob/main/docs/docs/
|
|
28
|
+
Intlayer mükemmel bir bağımsız i18n çözümü sunarken (bakınız [Next.js entegrasyon rehberimiz](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_nextjs_16.md)), birkaç nedenle next-intl ile birleştirmek isteyebilirsiniz:
|
|
26
29
|
|
|
27
30
|
1. **Mevcut kod tabanı**: Yerleşik bir next-intl uygulamanız var ve Intlayer'ın geliştirilmiş geliştirici deneyimine kademeli olarak geçmek istiyorsunuz.
|
|
28
31
|
2. **Eski gereksinimler**: Projeniz mevcut next-intl eklentileri veya iş akışları ile uyumluluk gerektiriyor.
|
|
29
|
-
3. **Takım aşinalığı**: Ekibiniz next-intl ile rahat ancak daha iyi içerik yönetimi istiyor.
|
|
32
|
+
3. **Takım aşinalığı**: Ekibiniz next-intl ile rahat çalışıyor ancak daha iyi içerik yönetimi istiyor.
|
|
33
|
+
4. **Intlayer özelliklerini kullanma**: İçerik beyanı, çeviri otomasyonu, çevirileri test etme ve daha fazlası gibi Intlayer özelliklerini kullanmak istiyorsunuz.
|
|
30
34
|
|
|
31
|
-
**Bunun için, Intlayer, JSON çevirilerinizi CLI veya CI/CD boru hatlarında otomatikleştirmeye, çevirilerinizi test etmeye ve daha fazlasına yardımcı olmak
|
|
35
|
+
**Bunun için, Intlayer, JSON çevirilerinizi CLI veya CI/CD boru hatlarında otomatikleştirmeye, çevirilerinizi test etmeye ve daha fazlasına yardımcı olmak için next-intl için bir adaptör olarak uygulanabilir.**
|
|
32
36
|
|
|
33
37
|
Bu rehber, Intlayer'ın üstün içerik beyan sistemi avantajlarından yararlanırken next-intl ile uyumluluğu nasıl koruyacağınızı gösterir.
|
|
34
38
|
|
|
@@ -36,7 +40,7 @@ Bu rehber, Intlayer'ın üstün içerik beyan sistemi avantajlarından yararlan
|
|
|
36
40
|
|
|
37
41
|
<TOC/>
|
|
38
42
|
|
|
39
|
-
## Intlayer'ı next-intl ile Kurmak
|
|
43
|
+
## Intlayer'ı next-intl ile Kurmak için Adım Adım Rehber
|
|
40
44
|
|
|
41
45
|
### Adım 1: Bağımlılıkları Yükleyin
|
|
42
46
|
|
|
@@ -54,6 +58,10 @@ pnpm add intlayer @intlayer/sync-json-plugin
|
|
|
54
58
|
yarn add intlayer @intlayer/sync-json-plugin
|
|
55
59
|
```
|
|
56
60
|
|
|
61
|
+
```bash packageManager="bun"
|
|
62
|
+
bun add intlayer @intlayer/sync-json-plugin
|
|
63
|
+
```
|
|
64
|
+
|
|
57
65
|
**Paket açıklamaları:**
|
|
58
66
|
|
|
59
67
|
- **intlayer**: Uluslararasılaştırma yönetimi, içerik beyanı ve oluşturma için temel kütüphane
|
|
@@ -61,9 +69,9 @@ yarn add intlayer @intlayer/sync-json-plugin
|
|
|
61
69
|
|
|
62
70
|
### Adım 2: JSON'u sarmak için Intlayer eklentisini uygulayın
|
|
63
71
|
|
|
64
|
-
Desteklenen
|
|
72
|
+
Desteklenen yerellerinizi tanımlamak için bir Intlayer yapılandırma dosyası oluşturun:
|
|
65
73
|
|
|
66
|
-
**
|
|
74
|
+
**Eğer next-intl için JSON sözlüklerini de dışa aktarmak istiyorsanız**, `syncJSON` eklentisini ekleyin:
|
|
67
75
|
|
|
68
76
|
```typescript fileName="intlayer.config.ts"
|
|
69
77
|
import { Locales, type IntlayerConfig } from "intlayer";
|
|
@@ -84,28 +92,71 @@ const config: IntlayerConfig = {
|
|
|
84
92
|
export default config;
|
|
85
93
|
```
|
|
86
94
|
|
|
87
|
-
`syncJSON` eklentisi JSON'u otomatik olarak
|
|
95
|
+
`syncJSON` eklentisi JSON'u otomatik olarak sarar. İçerik mimarisini değiştirmeden JSON dosyalarını okur ve yazar.
|
|
96
|
+
|
|
97
|
+
Eğer JSON dosyalarının intlayer içerik beyan dosyaları (`.content` dosyaları) ile birlikte var olmasını istiyorsanız, Intlayer şu şekilde ilerler:
|
|
98
|
+
|
|
99
|
+
1. Hem JSON hem de içerik beyan dosyalarını yükler ve bunları intlayer sözlüğüne dönüştürür.
|
|
100
|
+
2. JSON ile içerik beyan dosyaları arasında çakışma varsa, Intlayer tüm sözlükleri birleştirme işlemi yapacaktır. Bu, eklentilerin önceliğine ve içerik beyan dosyasının önceliğine bağlıdır (tüm ayarlar yapılandırılabilir).
|
|
101
|
+
|
|
102
|
+
JSON'u çevirmek için CLI kullanılarak veya CMS aracılığıyla değişiklikler yapılırsa, Intlayer JSON dosyasını yeni çevirilerle güncelleyecektir.
|
|
103
|
+
|
|
104
|
+
`syncJSON` eklentisi hakkında daha fazla ayrıntı için lütfen [syncJSON eklentisi dokümantasyonuna](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/plugins/sync-json.md) bakınız.
|
|
105
|
+
|
|
106
|
+
### (İsteğe Bağlı) Adım 3: Bileşen başına JSON çevirilerini uygulama
|
|
107
|
+
|
|
108
|
+
Varsayılan olarak, Intlayer hem JSON hem de içerik beyan dosyalarını yükler, birleştirir ve senkronize eder. Daha fazla ayrıntı için lütfen [içerik beyan dokümantasyonuna](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/dictionary/content_file.md) bakın. Ancak isterseniz, Intlayer eklentisi kullanarak, kod tabanınızın herhangi bir yerinde yerelleştirilmiş JSON'un bileşen bazında yönetimini de uygulayabilirsiniz.
|
|
109
|
+
|
|
110
|
+
Bunun için `loadJSON` eklentisini kullanabilirsiniz.
|
|
111
|
+
|
|
112
|
+
```ts fileName="intlayer.config.ts"
|
|
113
|
+
import { Locales, type IntlayerConfig } from "intlayer";
|
|
114
|
+
import { loadJSON, syncJSON } from "@intlayer/sync-json-plugin";
|
|
115
|
+
|
|
116
|
+
const config: IntlayerConfig = {
|
|
117
|
+
internationalization: {
|
|
118
|
+
locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
|
|
119
|
+
defaultLocale: Locales.ENGLISH,
|
|
120
|
+
},
|
|
88
121
|
|
|
89
|
-
|
|
122
|
+
// Mevcut JSON dosyalarınızı Intlayer sözlükleri ile senkronize tutun
|
|
123
|
+
plugins: [
|
|
124
|
+
/**
|
|
125
|
+
* src dizininde {key}.i18n.json desenine uyan tüm JSON dosyalarını yükler
|
|
126
|
+
*/
|
|
127
|
+
loadJSON({
|
|
128
|
+
source: ({ key }) => `./src/**/${key}.i18n.json`,
|
|
129
|
+
locale: Locales.ENGLISH,
|
|
130
|
+
priority: 1, // Bu JSON dosyalarının `./locales/en/${key}.json` dosyalarından öncelikli olmasını sağlar
|
|
131
|
+
}),
|
|
132
|
+
/**
|
|
133
|
+
* locales dizinindeki JSON dosyalarını yükler ve çıktı ile çevirileri bu dosyalara geri yazar
|
|
134
|
+
*/
|
|
135
|
+
syncJSON({
|
|
136
|
+
source: ({ key, locale }) => `./messages/${locale}/${key}.json`,
|
|
137
|
+
priority: 0,
|
|
138
|
+
}),
|
|
139
|
+
],
|
|
140
|
+
};
|
|
90
141
|
|
|
91
|
-
|
|
92
|
-
|
|
142
|
+
export default config;
|
|
143
|
+
```
|
|
93
144
|
|
|
94
|
-
|
|
145
|
+
Bu, `src` dizininde `{key}.i18n.json` desenine uyan tüm JSON dosyalarını yükleyecek ve bunları Intlayer sözlükleri olarak kullanacaktır.
|
|
95
146
|
|
|
96
147
|
## Git Yapılandırması
|
|
97
148
|
|
|
98
|
-
Otomatik oluşturulan Intlayer dosyalarını
|
|
149
|
+
Otomatik oluşturulan Intlayer dosyalarını göz ardı etmeniz önerilir:
|
|
99
150
|
|
|
100
151
|
```plaintext fileName=".gitignore"
|
|
101
|
-
# Intlayer tarafından oluşturulan dosyaları
|
|
152
|
+
# Intlayer tarafından oluşturulan dosyaları göz ardı et
|
|
102
153
|
.intlayer
|
|
103
154
|
```
|
|
104
155
|
|
|
105
|
-
Bu dosyalar derleme süreciniz sırasında yeniden oluşturulabilir ve sürüm kontrolüne dahil
|
|
156
|
+
Bu dosyalar, derleme süreciniz sırasında yeniden oluşturulabilir ve sürüm kontrolüne dahil edilmesine gerek yoktur.
|
|
106
157
|
|
|
107
158
|
### VS Code Eklentisi
|
|
108
159
|
|
|
109
160
|
Geliştirici deneyimini iyileştirmek için resmi **Intlayer VS Code Eklentisi**ni yükleyin:
|
|
110
161
|
|
|
111
|
-
[VS Code Marketplace'
|
|
162
|
+
[VS Code Marketplace'ten yükleyin](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
|