@intlayer/docs 8.5.2 → 8.6.0
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/intlayer_with_react_router_v7.md +2 -4
- package/docs/ar/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/ar/intlayer_with_svelte_kit.md +2 -2
- package/docs/ar/intlayer_with_tanstack+solid.md +0 -17
- package/docs/ar/intlayer_with_tanstack.md +0 -8
- package/docs/ar/intlayer_with_vite+lit.md +0 -1
- package/docs/ar/intlayer_with_vite+solid.md +0 -1
- package/docs/ar/intlayer_with_vite+svelte.md +1 -1
- package/docs/bn/intlayer_with_vite+lit.md +0 -1
- package/docs/cs/intlayer_with_vite+lit.md +0 -1
- package/docs/de/intlayer_with_react_router_v7.md +2 -4
- package/docs/de/intlayer_with_react_router_v7_fs_routes.md +1 -2
- package/docs/de/intlayer_with_svelte_kit.md +2 -2
- package/docs/de/intlayer_with_tanstack+solid.md +80 -21
- package/docs/de/intlayer_with_tanstack.md +96 -28
- package/docs/de/intlayer_with_vite+lit.md +0 -1
- package/docs/de/intlayer_with_vite+solid.md +0 -1
- package/docs/de/intlayer_with_vite+svelte.md +1 -1
- package/docs/en/intlayer_with_react_router_v7.md +1 -2
- package/docs/en/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/en/intlayer_with_svelte_kit.md +2 -2
- package/docs/en/intlayer_with_tanstack+solid.md +81 -19
- package/docs/en/intlayer_with_tanstack.md +81 -10
- package/docs/en/intlayer_with_vite+lit.md +0 -1
- package/docs/en/intlayer_with_vite+solid.md +0 -1
- package/docs/en/intlayer_with_vite+svelte.md +5 -6
- package/docs/en-GB/intlayer_with_react_router_v7.md +2 -4
- package/docs/en-GB/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/en-GB/intlayer_with_svelte_kit.md +2 -2
- package/docs/en-GB/intlayer_with_tanstack+solid.md +73 -17
- package/docs/en-GB/intlayer_with_tanstack.md +74 -9
- package/docs/en-GB/intlayer_with_vite+lit.md +0 -1
- package/docs/en-GB/intlayer_with_vite+solid.md +0 -1
- package/docs/en-GB/intlayer_with_vite+svelte.md +1 -1
- package/docs/es/intlayer_with_react_router_v7.md +2 -4
- package/docs/es/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/es/intlayer_with_svelte_kit.md +2 -2
- package/docs/es/intlayer_with_tanstack+solid.md +80 -21
- package/docs/es/intlayer_with_tanstack.md +96 -28
- package/docs/es/intlayer_with_vite+lit.md +0 -1
- package/docs/es/intlayer_with_vite+solid.md +0 -1
- package/docs/es/intlayer_with_vite+svelte.md +1 -1
- package/docs/fr/intlayer_with_react_router_v7.md +2 -4
- package/docs/fr/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/fr/intlayer_with_svelte_kit.md +3 -3
- package/docs/fr/intlayer_with_tanstack+solid.md +80 -21
- package/docs/fr/intlayer_with_tanstack.md +96 -28
- package/docs/fr/intlayer_with_vite+lit.md +0 -1
- package/docs/fr/intlayer_with_vite+solid.md +0 -1
- package/docs/fr/intlayer_with_vite+svelte.md +1 -1
- package/docs/hi/intlayer_with_react_router_v7.md +2 -4
- package/docs/hi/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/hi/intlayer_with_svelte_kit.md +2 -2
- package/docs/hi/intlayer_with_tanstack+solid.md +0 -17
- package/docs/hi/intlayer_with_tanstack.md +0 -8
- package/docs/hi/intlayer_with_vite+lit.md +0 -1
- package/docs/hi/intlayer_with_vite+solid.md +0 -1
- package/docs/hi/intlayer_with_vite+svelte.md +1 -1
- package/docs/id/intlayer_with_react_router_v7.md +2 -4
- package/docs/id/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/id/intlayer_with_svelte_kit.md +2 -2
- package/docs/id/intlayer_with_tanstack+solid.md +0 -17
- package/docs/id/intlayer_with_tanstack.md +0 -8
- package/docs/id/intlayer_with_vite+lit.md +0 -1
- package/docs/id/intlayer_with_vite+solid.md +0 -1
- package/docs/id/intlayer_with_vite+svelte.md +1 -1
- package/docs/it/intlayer_with_react_router_v7.md +2 -4
- package/docs/it/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/it/intlayer_with_svelte_kit.md +3 -3
- package/docs/it/intlayer_with_tanstack+solid.md +78 -19
- package/docs/it/intlayer_with_tanstack.md +96 -30
- package/docs/it/intlayer_with_vite+lit.md +0 -1
- package/docs/it/intlayer_with_vite+solid.md +0 -1
- package/docs/it/intlayer_with_vite+svelte.md +1 -1
- package/docs/ja/intlayer_with_react_router_v7.md +1 -2
- package/docs/ja/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/ja/intlayer_with_tanstack+solid.md +83 -22
- package/docs/ja/intlayer_with_tanstack.md +779 -93
- package/docs/ja/intlayer_with_vite+lit.md +0 -1
- package/docs/ja/intlayer_with_vite+solid.md +0 -1
- package/docs/ja/intlayer_with_vite+svelte.md +1 -1
- package/docs/ko/intlayer_with_react_router_v7.md +2 -4
- package/docs/ko/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/ko/intlayer_with_svelte_kit.md +2 -2
- package/docs/ko/intlayer_with_tanstack+solid.md +81 -22
- package/docs/ko/intlayer_with_tanstack.md +95 -101
- package/docs/ko/intlayer_with_vite+lit.md +0 -1
- package/docs/ko/intlayer_with_vite+solid.md +0 -1
- package/docs/ko/intlayer_with_vite+svelte.md +1 -1
- package/docs/nl/intlayer_with_vite+lit.md +0 -1
- package/docs/pl/intlayer_with_react_router_v7.md +2 -4
- package/docs/pl/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/pl/intlayer_with_svelte_kit.md +2 -2
- package/docs/pl/intlayer_with_tanstack+solid.md +0 -17
- package/docs/pl/intlayer_with_tanstack.md +0 -8
- package/docs/pl/intlayer_with_vite+lit.md +0 -1
- package/docs/pl/intlayer_with_vite+solid.md +0 -1
- package/docs/pl/intlayer_with_vite+svelte.md +1 -1
- package/docs/pt/intlayer_with_react_router_v7.md +1 -2
- package/docs/pt/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/pt/intlayer_with_svelte_kit.md +3 -3
- package/docs/pt/intlayer_with_tanstack+solid.md +78 -19
- package/docs/pt/intlayer_with_tanstack.md +96 -30
- package/docs/pt/intlayer_with_vite+lit.md +0 -1
- package/docs/pt/intlayer_with_vite+solid.md +0 -1
- package/docs/pt/intlayer_with_vite+svelte.md +1 -1
- package/docs/ru/intlayer_with_react_router_v7.md +2 -4
- package/docs/ru/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/ru/intlayer_with_svelte_kit.md +2 -2
- package/docs/ru/intlayer_with_tanstack+solid.md +80 -21
- package/docs/ru/intlayer_with_tanstack.md +99 -33
- package/docs/ru/intlayer_with_vite+lit.md +0 -1
- package/docs/ru/intlayer_with_vite+solid.md +0 -1
- package/docs/ru/intlayer_with_vite+svelte.md +1 -1
- package/docs/tr/intlayer_with_react_router_v7.md +2 -4
- package/docs/tr/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/tr/intlayer_with_svelte_kit.md +2 -2
- package/docs/tr/intlayer_with_tanstack+solid.md +0 -17
- package/docs/tr/intlayer_with_tanstack.md +0 -8
- package/docs/tr/intlayer_with_vite+lit.md +0 -1
- package/docs/tr/intlayer_with_vite+solid.md +0 -1
- package/docs/tr/intlayer_with_vite+svelte.md +1 -1
- package/docs/uk/intlayer_with_react_router_v7.md +1 -2
- package/docs/uk/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/uk/intlayer_with_svelte_kit.md +2 -2
- package/docs/uk/intlayer_with_tanstack+solid.md +0 -17
- package/docs/uk/intlayer_with_tanstack.md +0 -8
- package/docs/uk/intlayer_with_vite+lit.md +0 -1
- package/docs/uk/intlayer_with_vite+solid.md +0 -1
- package/docs/uk/intlayer_with_vite+svelte.md +1 -1
- package/docs/ur/intlayer_with_vite+lit.md +0 -1
- package/docs/vi/intlayer_with_react_router_v7.md +2 -4
- package/docs/vi/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/vi/intlayer_with_svelte_kit.md +2 -2
- package/docs/vi/intlayer_with_tanstack+solid.md +0 -17
- package/docs/vi/intlayer_with_tanstack.md +0 -8
- package/docs/vi/intlayer_with_vite+lit.md +0 -1
- package/docs/vi/intlayer_with_vite+solid.md +0 -1
- package/docs/vi/intlayer_with_vite+svelte.md +1 -1
- package/docs/zh/intlayer_with_react_router_v7.md +2 -4
- package/docs/zh/intlayer_with_react_router_v7_fs_routes.md +2 -4
- package/docs/zh/intlayer_with_svelte_kit.md +2 -2
- package/docs/zh/intlayer_with_tanstack+solid.md +82 -23
- package/docs/zh/intlayer_with_tanstack.md +96 -104
- package/docs/zh/intlayer_with_vite+lit.md +0 -1
- package/docs/zh/intlayer_with_vite+solid.md +0 -1
- package/docs/zh/intlayer_with_vite+svelte.md +1 -1
- package/package.json +8 -8
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
---
|
|
2
2
|
createdAt: 2025-03-25
|
|
3
|
-
updatedAt: 2026-03-
|
|
3
|
+
updatedAt: 2026-03-29
|
|
4
4
|
title: i18n Tanstack Start — Как перевести приложение Tanstack Start с использованием Solid.js в 2026 году
|
|
5
5
|
description: Узнайте, как добавить интернационализацию (i18n) в ваше приложение Tanstack Start с помощью Intlayer и Solid.js. Следуйте этому подробному руководству, чтобы сделать ваше приложение многоязычным с маршрутизацией, учитывающей локаль.
|
|
6
6
|
keywords:
|
|
@@ -12,6 +12,7 @@ keywords:
|
|
|
12
12
|
- i18n
|
|
13
13
|
- TypeScript
|
|
14
14
|
- Маршрутизация локалей
|
|
15
|
+
- Sitemap
|
|
15
16
|
slugs:
|
|
16
17
|
- doc
|
|
17
18
|
- environment
|
|
@@ -140,16 +141,12 @@ export default config;
|
|
|
140
141
|
import { intlayer } from "vite-intlayer";
|
|
141
142
|
import { defineConfig } from "vite";
|
|
142
143
|
import { devtools } from "@tanstack/devtools-vite";
|
|
143
|
-
import viteTsConfigPaths from "vite-tsconfig-paths";
|
|
144
144
|
import { tanstackStart } from "@tanstack/solid-start/plugin/vite";
|
|
145
145
|
import solidPlugin from "vite-plugin-solid";
|
|
146
146
|
|
|
147
147
|
export default defineConfig({
|
|
148
148
|
plugins: [
|
|
149
149
|
devtools(),
|
|
150
|
-
viteTsConfigPaths({
|
|
151
|
-
projects: ["./tsconfig.json"],
|
|
152
|
-
}),
|
|
153
150
|
tanstackStart({
|
|
154
151
|
router: {
|
|
155
152
|
routeFileIgnorePattern:
|
|
@@ -221,9 +218,6 @@ function RootComponent() {
|
|
|
221
218
|
}
|
|
222
219
|
```
|
|
223
220
|
|
|
224
|
-
> [!NOTE]
|
|
225
|
-
> В Solid `useMatches` возвращает **сигнал** (реактивный аксессор). Используйте `matches()` (со скобками) для реактивного доступа к текущему значению.
|
|
226
|
-
|
|
227
221
|
### Шаг 6: Создание макета локали (необязательно)
|
|
228
222
|
|
|
229
223
|
Создайте макет, который обрабатывает префикс локали и выполняет валидацию. Этот макет гарантирует, что будут обрабатываться только допустимые локали.
|
|
@@ -415,7 +409,6 @@ function RouteComponent() {
|
|
|
415
409
|
}
|
|
416
410
|
```
|
|
417
411
|
|
|
418
|
-
> [!NOTE]
|
|
419
412
|
> В Solid хук `useIntlayer` возвращает функцию-**аксессор** (например, `content()`). Вы должны вызвать эту функцию для доступа к реактивному контенту.
|
|
420
413
|
>
|
|
421
414
|
> Чтобы узнать больше о хуке `useIntlayer`, обратитесь к [документации](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ru/packages/solid-intlayer/useIntlayer.md).
|
|
@@ -460,7 +453,6 @@ export const LocaleSwitcher = () => {
|
|
|
460
453
|
export default LocaleSwitcher;
|
|
461
454
|
```
|
|
462
455
|
|
|
463
|
-
> [!NOTE]
|
|
464
456
|
> В Solid `locale` из `useLocale` — это **аксессор сигнала**. Используйте `locale()` (со скобками) для реактивного чтения текущего значения.
|
|
465
457
|
>
|
|
466
458
|
> Чтобы узнать больше о хуке `useLocale`, обратитесь к [документации](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ru/packages/solid-intlayer/useLocale.md).
|
|
@@ -502,15 +494,11 @@ import solid from "vite-plugin-solid";
|
|
|
502
494
|
import { nitro } from "nitro/vite";
|
|
503
495
|
import { defineConfig } from "vite";
|
|
504
496
|
import { intlayer, intlayerProxy } from "vite-intlayer";
|
|
505
|
-
import viteTsConfigPaths from "vite-tsconfig-paths";
|
|
506
497
|
|
|
507
498
|
export default defineConfig({
|
|
508
499
|
plugins: [
|
|
509
500
|
intlayerProxy(), // Прокси должен быть размещен перед сервером, если вы используете Nitro
|
|
510
501
|
nitro(),
|
|
511
|
-
viteTsConfigPaths({
|
|
512
|
-
projects: ["./tsconfig.json"],
|
|
513
|
-
}),
|
|
514
502
|
intlayer(),
|
|
515
503
|
tanstackStart({
|
|
516
504
|
router: {
|
|
@@ -551,7 +539,7 @@ export const Route = createFileRoute("/{-$locale}/")({
|
|
|
551
539
|
|
|
552
540
|
---
|
|
553
541
|
|
|
554
|
-
### Шаг
|
|
542
|
+
### Шаг 13: Получение локали в ваших серверных действиях (необязательно)
|
|
555
543
|
|
|
556
544
|
Возможно, вы захотите получить доступ к текущей локали внутри ваших серверных действий (server actions) или конечных точек API.
|
|
557
545
|
Вы можете сделать это с помощью помощника `getLocale` из `intlayer`.
|
|
@@ -588,7 +576,7 @@ export const getLocaleServer = createServerFn().handler(async () => {
|
|
|
588
576
|
|
|
589
577
|
---
|
|
590
578
|
|
|
591
|
-
### Шаг
|
|
579
|
+
### Шаг 14: Управление страницами 404 (необязательно)
|
|
592
580
|
|
|
593
581
|
Когда пользователь посещает несуществующую страницу, вы можете отобразить кастомную страницу 404. Префикс локали может влиять на то, как срабатывает страница "Запрашиваемый ресурс не найден".
|
|
594
582
|
|
|
@@ -662,7 +650,7 @@ export const Route = createFileRoute("/{-$locale}/$")({
|
|
|
662
650
|
});
|
|
663
651
|
```
|
|
664
652
|
|
|
665
|
-
### (Необязательно) Шаг
|
|
653
|
+
### (Необязательно) Шаг 15: Извлечение контента из ваших компонентов
|
|
666
654
|
|
|
667
655
|
Если у вас есть существующая кодовая база, трансформация тысяч файлов может занять много времени.
|
|
668
656
|
|
|
@@ -803,16 +791,12 @@ bun x intlayer extract
|
|
|
803
791
|
import { intlayer, intlayerCompiler } from "vite-intlayer";
|
|
804
792
|
import { defineConfig } from "vite";
|
|
805
793
|
import { devtools } from "@tanstack/devtools-vite";
|
|
806
|
-
import viteTsConfigPaths from "vite-tsconfig-paths";
|
|
807
794
|
import { tanstackStart } from "@tanstack/solid-start/plugin/vite";
|
|
808
795
|
import solidPlugin from "vite-plugin-solid";
|
|
809
796
|
|
|
810
797
|
export default defineConfig({
|
|
811
798
|
plugins: [
|
|
812
799
|
devtools(),
|
|
813
|
-
viteTsConfigPaths({
|
|
814
|
-
projects: ["./tsconfig.json"],
|
|
815
|
-
}),
|
|
816
800
|
tanstackStart({
|
|
817
801
|
router: {
|
|
818
802
|
routeFileIgnorePattern:
|
|
@@ -847,6 +831,81 @@ bun run build # Или bun run dev
|
|
|
847
831
|
|
|
848
832
|
---
|
|
849
833
|
|
|
834
|
+
### Шаг 16: Генерация карты сайта (Sitemap) (опционально)
|
|
835
|
+
|
|
836
|
+
Intlayer поставляется со встроенным генератором карты сайта, который поможет вам легко создать карту сайта для вашего приложения. Он учитывает локализованные маршруты и добавляет необходимые метаданные для поисковых систем.
|
|
837
|
+
|
|
838
|
+
> Создаваемая Intlayer карта сайта поддерживает пространство имен `xhtml:link` (Hreflang XML Extensions). В отличие от стандартных генераторов карт сайта, которые просто перечисляют прямые URL-адреса, Intlayer автоматически создает необходимые двусторонние связи между всеми языковыми версиями страницы (например, `/about`, `/about?lang=fr` и `/about?lang=es`). Это гарантирует, что поисковые системы будут правильно индексировать и показывать нужную языковую версию соответствующей аудитории.
|
|
839
|
+
|
|
840
|
+
Чтобы использовать его, вам сначала нужно настроить ваш файл `vite.config.ts`, чтобы включить предварительный рендеринг (pre-rendering) для ваших локализованных маршрутов и отключить генерацию карты сайта по умолчанию в TanStack Start.
|
|
841
|
+
|
|
842
|
+
```typescript fileName="vite.config.ts"
|
|
843
|
+
import { localeMap, localeFlatMap } from "intlayer";
|
|
844
|
+
// ... другие импорты
|
|
845
|
+
|
|
846
|
+
export const pathList = ["", "/about", "/404"];
|
|
847
|
+
|
|
848
|
+
const localizedPages = localeFlatMap(({ urlPrefix }) =>
|
|
849
|
+
pathList.map((path) => ({
|
|
850
|
+
path: `${urlPrefix}${path}`,
|
|
851
|
+
prerender: {
|
|
852
|
+
enabled: true,
|
|
853
|
+
},
|
|
854
|
+
}))
|
|
855
|
+
);
|
|
856
|
+
|
|
857
|
+
export default defineConfig({
|
|
858
|
+
plugins: [
|
|
859
|
+
// ... другие плагины
|
|
860
|
+
tanstackStart({
|
|
861
|
+
// ... другие настройки
|
|
862
|
+
sitemap: {
|
|
863
|
+
enabled: false,
|
|
864
|
+
},
|
|
865
|
+
prerender: {
|
|
866
|
+
enabled: true,
|
|
867
|
+
crawlLinks: false,
|
|
868
|
+
concurrency: 10,
|
|
869
|
+
},
|
|
870
|
+
pages: localizedPages,
|
|
871
|
+
}),
|
|
872
|
+
],
|
|
873
|
+
});
|
|
874
|
+
```
|
|
875
|
+
|
|
876
|
+
Затем создайте маршрут `src/routes/sitemap[.]xml.ts`, который использует функцию `generateSitemap`:
|
|
877
|
+
|
|
878
|
+
```typescript fileName="src/routes/sitemap[.]xml.ts"
|
|
879
|
+
import { createFileRoute } from "@tanstack/solid-router";
|
|
880
|
+
import { generateSitemap } from "intlayer";
|
|
881
|
+
|
|
882
|
+
const SITE_URL = (
|
|
883
|
+
import.meta.env.VITE_SITE_URL ?? "http://localhost:3000"
|
|
884
|
+
).replace(/\/$/, "");
|
|
885
|
+
|
|
886
|
+
export const Route = createFileRoute("/sitemap.xml")({
|
|
887
|
+
server: {
|
|
888
|
+
handlers: {
|
|
889
|
+
GET: async () => {
|
|
890
|
+
const sitemap = generateSitemap(
|
|
891
|
+
[
|
|
892
|
+
{ path: "/", changefreq: "daily", priority: 1.0 },
|
|
893
|
+
{ path: "/about", changefreq: "monthly", priority: 0.8 },
|
|
894
|
+
],
|
|
895
|
+
{ siteUrl: SITE_URL }
|
|
896
|
+
);
|
|
897
|
+
|
|
898
|
+
return new Response(sitemap, {
|
|
899
|
+
headers: { "Content-Type": "application/xml" },
|
|
900
|
+
});
|
|
901
|
+
},
|
|
902
|
+
},
|
|
903
|
+
},
|
|
904
|
+
});
|
|
905
|
+
```
|
|
906
|
+
|
|
907
|
+
---
|
|
908
|
+
|
|
850
909
|
### Шаг 17: Настройка TypeScript (необязательно)
|
|
851
910
|
|
|
852
911
|
Intlayer использует расширение модулей (module augmentation), чтобы задействовать преимущества TypeScript и сделать вашу кодовую базу более надежной.
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
---
|
|
2
2
|
createdAt: 2025-09-09
|
|
3
|
-
updatedAt: 2026-03-
|
|
3
|
+
updatedAt: 2026-03-29
|
|
4
4
|
title: Tanstack Start i18n - Как перевести приложение Tanstack Start в 2026
|
|
5
5
|
description: Узнайте, как добавить интернационализацию (i18n) в ваше приложение Tanstack Start с помощью Intlayer. Следуйте этому подробному руководству, чтобы сделать ваше приложение многоязычным с маршрутизацией, учитывающей локаль.
|
|
6
6
|
keywords:
|
|
@@ -12,6 +12,7 @@ keywords:
|
|
|
12
12
|
- i18n
|
|
13
13
|
- TypeScript
|
|
14
14
|
- Маршрутизация по локали
|
|
15
|
+
- Sitemap
|
|
15
16
|
slugs:
|
|
16
17
|
- doc
|
|
17
18
|
- environment
|
|
@@ -160,14 +161,10 @@ import viteReact from "@vitejs/plugin-react";
|
|
|
160
161
|
import { nitro } from "nitro/vite";
|
|
161
162
|
import { defineConfig } from "vite";
|
|
162
163
|
import { intlayer } from "vite-intlayer";
|
|
163
|
-
import viteTsConfigPaths from "vite-tsconfig-paths";
|
|
164
164
|
|
|
165
165
|
const config = defineConfig({
|
|
166
166
|
plugins: [
|
|
167
167
|
nitro(),
|
|
168
|
-
viteTsConfigPaths({
|
|
169
|
-
projects: ["./tsconfig.json"],
|
|
170
|
-
}),
|
|
171
168
|
intlayer(),
|
|
172
169
|
tanstackStart({
|
|
173
170
|
router: {
|
|
@@ -593,15 +590,11 @@ import viteReact from "@vitejs/plugin-react";
|
|
|
593
590
|
import { nitro } from "nitro/vite";
|
|
594
591
|
import { defineConfig } from "vite";
|
|
595
592
|
import { intlayer, intlayerProxy } from "vite-intlayer";
|
|
596
|
-
import viteTsConfigPaths from "vite-tsconfig-paths";
|
|
597
593
|
|
|
598
594
|
export default defineConfig({
|
|
599
595
|
plugins: [
|
|
600
596
|
intlayerProxy(), // Прокси должен быть размещен перед сервером, если вы используете Nitro
|
|
601
597
|
nitro(),
|
|
602
|
-
viteTsConfigPaths({
|
|
603
|
-
projects: ["./tsconfig.json"],
|
|
604
|
-
}),
|
|
605
598
|
intlayer(),
|
|
606
599
|
tanstackStart({
|
|
607
600
|
router: {
|
|
@@ -616,7 +609,7 @@ export default defineConfig({
|
|
|
616
609
|
|
|
617
610
|
---
|
|
618
611
|
|
|
619
|
-
### Шаг
|
|
612
|
+
### Шаг 12: Интернационализация метаданных (опционально)
|
|
620
613
|
|
|
621
614
|
Вы также можете использовать хук `getIntlayer` для доступа к вашим словарям контента во всем приложении:
|
|
622
615
|
|
|
@@ -642,7 +635,7 @@ export const Route = createFileRoute("/{-$locale}/")({
|
|
|
642
635
|
|
|
643
636
|
---
|
|
644
637
|
|
|
645
|
-
### Шаг
|
|
638
|
+
### Шаг 13: Получение локали в серверных действиях (опционально)
|
|
646
639
|
|
|
647
640
|
Вы можете захотеть получить доступ к текущей локали внутри ваших серверных действий или конечных точек API.
|
|
648
641
|
Вы можете сделать это с помощью помощника `getLocale` из `intlayer`.
|
|
@@ -679,7 +672,7 @@ export const getLocaleServer = createServerFn().handler(async () => {
|
|
|
679
672
|
|
|
680
673
|
---
|
|
681
674
|
|
|
682
|
-
### Шаг
|
|
675
|
+
### Шаг 14: Управление страницами "не найдено" (опционально)
|
|
683
676
|
|
|
684
677
|
Когда пользователь посещает несуществующую страницу, вы можете отобразить пользовательскую страницу "не найдено", и префикс локали может повлиять на способ срабатывания страницы "не найдено".
|
|
685
678
|
|
|
@@ -753,27 +746,7 @@ export const Route = createFileRoute("/{-$locale}/$")({
|
|
|
753
746
|
});
|
|
754
747
|
```
|
|
755
748
|
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
### Шаг 16: Настройка TypeScript (опционально)
|
|
759
|
-
|
|
760
|
-
Intlayer использует расширение модулей (module augmentation), чтобы использовать преимущества TypeScript и сделать вашу кодовую базу более надежной.
|
|
761
|
-
|
|
762
|
-
Убедитесь, что ваша конфигурация TypeScript включает автоматически сгенерированные типы:
|
|
763
|
-
|
|
764
|
-
```json5 fileName="tsconfig.json"
|
|
765
|
-
{
|
|
766
|
-
// ... ваши существующие настройки
|
|
767
|
-
include: [
|
|
768
|
-
// ... ваши существующие включения
|
|
769
|
-
".intlayer/**/*.ts", // Включить автоматически сгенерированные типы
|
|
770
|
-
],
|
|
771
|
-
}
|
|
772
|
-
```
|
|
773
|
-
|
|
774
|
-
---
|
|
775
|
-
|
|
776
|
-
### (Опционально) Шаг 1 : Извлечение содержимого ваших компонентов
|
|
749
|
+
### (Опционально) Шаг 15: Извлечение содержимого ваших компонентов
|
|
777
750
|
|
|
778
751
|
Если у вас есть существующая кодовая база, преобразование тысяч файлов может занять много времени.
|
|
779
752
|
|
|
@@ -931,6 +904,99 @@ bun run build # Or bun run dev
|
|
|
931
904
|
|
|
932
905
|
---
|
|
933
906
|
|
|
907
|
+
### Шаг 16: Генерация карты сайта (Sitemap) (опционально)
|
|
908
|
+
|
|
909
|
+
Intlayer поставляется со встроенным генератором карты сайта, который поможет вам легко создать карту сайта для вашего приложения. Он учитывает локализованные маршруты и добавляет необходимые метаданные для поисковых систем.
|
|
910
|
+
|
|
911
|
+
> Создаваемая Intlayer карта сайта поддерживает пространство имен `xhtml:link` (Hreflang XML Extensions). В отличие от стандартных генераторов карт сайта, которые просто перечисляют прямые URL-адреса, Intlayer автоматически создает необходимые двусторонние связи между всеми языковыми версиями страницы (например, `/about`, `/about?lang=fr` и `/about?lang=es`). Это гарантирует, что поисковые системы будут правильно индексировать и показывать нужную языковую версию соответствующей аудитории.
|
|
912
|
+
|
|
913
|
+
Чтобы использовать его, вам сначала нужно настроить ваш файл `vite.config.ts`, чтобы включить предварительный рендеринг (pre-rendering) для ваших локализованных маршрутов и отключить генерацию карты сайта по умолчанию в TanStack Start.
|
|
914
|
+
|
|
915
|
+
```typescript fileName="vite.config.ts"
|
|
916
|
+
import { localeFlatMap } from "intlayer";
|
|
917
|
+
// ... другие импорты
|
|
918
|
+
|
|
919
|
+
export const pathList = ["", "/about", "/404"];
|
|
920
|
+
|
|
921
|
+
const localizedPages = localeFlatMap(({ urlPrefix }) =>
|
|
922
|
+
pathList.map((path) => ({
|
|
923
|
+
path: `${urlPrefix}${path}`,
|
|
924
|
+
prerender: {
|
|
925
|
+
enabled: true,
|
|
926
|
+
},
|
|
927
|
+
}))
|
|
928
|
+
);
|
|
929
|
+
|
|
930
|
+
export default defineConfig({
|
|
931
|
+
plugins: [
|
|
932
|
+
// ... другие плагины
|
|
933
|
+
tanstackStart({
|
|
934
|
+
// ... другие настройки
|
|
935
|
+
sitemap: {
|
|
936
|
+
enabled: false,
|
|
937
|
+
},
|
|
938
|
+
prerender: {
|
|
939
|
+
enabled: true,
|
|
940
|
+
crawlLinks: false,
|
|
941
|
+
concurrency: 10,
|
|
942
|
+
},
|
|
943
|
+
pages: localizedPages,
|
|
944
|
+
}),
|
|
945
|
+
],
|
|
946
|
+
});
|
|
947
|
+
```
|
|
948
|
+
|
|
949
|
+
Затем создайте маршрут `src/routes/sitemap[.]xml.ts`, который использует функцию `generateSitemap`:
|
|
950
|
+
|
|
951
|
+
```typescript fileName="src/routes/sitemap[.]xml.ts"
|
|
952
|
+
import { createFileRoute } from "@tanstack/react-router";
|
|
953
|
+
import { generateSitemap } from "intlayer";
|
|
954
|
+
|
|
955
|
+
const SITE_URL = (
|
|
956
|
+
import.meta.env.VITE_SITE_URL ?? "http://localhost:3000"
|
|
957
|
+
).replace(/\/$/, "");
|
|
958
|
+
|
|
959
|
+
export const Route = createFileRoute("/sitemap.xml")({
|
|
960
|
+
server: {
|
|
961
|
+
handlers: {
|
|
962
|
+
GET: async () => {
|
|
963
|
+
const sitemap = generateSitemap(
|
|
964
|
+
[
|
|
965
|
+
{ path: "/", changefreq: "daily", priority: 1.0 },
|
|
966
|
+
{ path: "/about", changefreq: "monthly", priority: 0.8 },
|
|
967
|
+
],
|
|
968
|
+
{ siteUrl: SITE_URL }
|
|
969
|
+
);
|
|
970
|
+
|
|
971
|
+
return new Response(sitemap, {
|
|
972
|
+
headers: { "Content-Type": "application/xml" },
|
|
973
|
+
});
|
|
974
|
+
},
|
|
975
|
+
},
|
|
976
|
+
},
|
|
977
|
+
});
|
|
978
|
+
```
|
|
979
|
+
|
|
980
|
+
---
|
|
981
|
+
|
|
982
|
+
### Шаг 17: Настройка TypeScript (опционально)
|
|
983
|
+
|
|
984
|
+
Intlayer использует расширение модулей (module augmentation), чтобы использовать преимущества TypeScript и сделать вашу кодовую базу более надежной.
|
|
985
|
+
|
|
986
|
+
Убедитесь, что ваша конфигурация TypeScript включает автоматически сгенерированные типы:
|
|
987
|
+
|
|
988
|
+
```json5 fileName="tsconfig.json"
|
|
989
|
+
{
|
|
990
|
+
// ... ваши существующие настройки
|
|
991
|
+
include: [
|
|
992
|
+
// ... ваши существующие включения
|
|
993
|
+
".intlayer/**/*.ts", // Включить автоматически сгенерированные типы
|
|
994
|
+
],
|
|
995
|
+
}
|
|
996
|
+
```
|
|
997
|
+
|
|
998
|
+
---
|
|
999
|
+
|
|
934
1000
|
### Конфигурация Git
|
|
935
1001
|
|
|
936
1002
|
Рекомендуется игнорировать файлы, сгенерированные Intlayer. Это позволит избежать их коммита в ваш Git-репозиторий.
|
|
@@ -316,7 +316,6 @@ const App: Component = () => (
|
|
|
316
316
|
export default App;
|
|
317
317
|
```
|
|
318
318
|
|
|
319
|
-
> [!NOTE]
|
|
320
319
|
> В Solid `useIntlayer` возвращает функцию **accessor** (например, `content()`). Вы должны вызвать эту функцию для доступа к реактивному контенту.
|
|
321
320
|
|
|
322
321
|
> Если вы хотите использовать ваш контент в атрибуте `string`, таком как `alt`, `title`, `href`, `aria-label` и т.д., вы должны вызвать значение функции, например:
|
|
@@ -233,7 +233,7 @@ module.exports = appContent;
|
|
|
233
233
|
<!-- Отобразить контент как простой контент -->
|
|
234
234
|
<h1>{$content.title}</h1>
|
|
235
235
|
<!-- Отобразить контент с возможностью редактирования через редактор -->
|
|
236
|
-
<h1
|
|
236
|
+
<h1>{@const Title = $content.title}<Title /></h1>
|
|
237
237
|
<!-- Отобразить контент как строку -->
|
|
238
238
|
<div aria-label={$content.title.value}></div>
|
|
239
239
|
|
|
@@ -174,10 +174,9 @@ Yapılandırmanıza intlayer eklentisini ekleyin:
|
|
|
174
174
|
import { reactRouter } from "@react-router/dev/vite";
|
|
175
175
|
import { defineConfig } from "vite";
|
|
176
176
|
import { intlayer } from "vite-intlayer";
|
|
177
|
-
import tsconfigPaths from "vite-tsconfig-paths";
|
|
178
177
|
|
|
179
178
|
export default defineConfig({
|
|
180
|
-
plugins: [reactRouter(),
|
|
179
|
+
plugins: [reactRouter(), intlayer()],
|
|
181
180
|
});
|
|
182
181
|
```
|
|
183
182
|
|
|
@@ -739,13 +738,12 @@ Ayrıca uygulamanıza sunucu tarafı yönlendirme eklemek için `intlayerProxy`
|
|
|
739
738
|
import { reactRouter } from "@react-router/dev/vite";
|
|
740
739
|
import { defineConfig } from "vite";
|
|
741
740
|
import { intlayer, intlayerProxy } from "vite-intlayer";
|
|
742
|
-
import tsconfigPaths from "vite-tsconfig-paths";
|
|
743
741
|
|
|
744
742
|
export default defineConfig({
|
|
745
743
|
plugins: [
|
|
746
744
|
intlayerProxy(), // should be placed first
|
|
747
745
|
reactRouter(),
|
|
748
|
-
|
|
746
|
+
|
|
749
747
|
intlayer(),
|
|
750
748
|
],
|
|
751
749
|
});
|
|
@@ -169,10 +169,9 @@ Yapılandırmanıza intlayer eklentisini ekleyin:
|
|
|
169
169
|
import { reactRouter } from "@react-router/dev/vite";
|
|
170
170
|
import { defineConfig } from "vite";
|
|
171
171
|
import { intlayer } from "vite-intlayer";
|
|
172
|
-
import tsconfigPaths from "vite-tsconfig-paths";
|
|
173
172
|
|
|
174
173
|
export default defineConfig({
|
|
175
|
-
plugins: [reactRouter(),
|
|
174
|
+
plugins: [reactRouter(), intlayer()],
|
|
176
175
|
});
|
|
177
176
|
```
|
|
178
177
|
|
|
@@ -809,13 +808,12 @@ Ayrıca uygulamanıza sunucu tarafı yönlendirme eklemek için `intlayerProxy`
|
|
|
809
808
|
import { reactRouter } from "@react-router/dev/vite";
|
|
810
809
|
import { defineConfig } from "vite";
|
|
811
810
|
import { intlayer, intlayerProxy } from "vite-intlayer";
|
|
812
|
-
import tsconfigPaths from "vite-tsconfig-paths";
|
|
813
811
|
|
|
814
812
|
export default defineConfig({
|
|
815
813
|
plugins: [
|
|
816
814
|
intlayerProxy(), // should be placed first
|
|
817
815
|
reactRouter(),
|
|
818
|
-
|
|
816
|
+
|
|
819
817
|
intlayer(),
|
|
820
818
|
],
|
|
821
819
|
});
|
|
@@ -370,7 +370,7 @@ export default heroContent;
|
|
|
370
370
|
<!-- İçeriği basit içerik olarak render et -->
|
|
371
371
|
<h1>{$content.title}</h1>
|
|
372
372
|
<!-- İçeriği editör kullanarak düzenlenebilir şekilde render etmek için -->
|
|
373
|
-
<h1
|
|
373
|
+
<h1>{@const Title = $content.title}<Title /></h1>
|
|
374
374
|
<!-- İçeriği string olarak render etmek için -->
|
|
375
375
|
<div aria-label={$content.title.value}></div>
|
|
376
376
|
```
|
|
@@ -726,7 +726,7 @@ intlayer editör seçicisini görselleştirebilmek için, intlayer içeriğinizd
|
|
|
726
726
|
<h1>{$content.title}</h1>
|
|
727
727
|
|
|
728
728
|
<!-- İçeriği bir bileşen olarak render et (editör tarafından gereklidir) -->
|
|
729
|
-
|
|
729
|
+
{@const Component = $content.component}<Component />
|
|
730
730
|
</div>
|
|
731
731
|
```
|
|
732
732
|
|
|
@@ -140,16 +140,12 @@ Bite yapılandırmanıza intlayer eklentisini ekleyin:
|
|
|
140
140
|
import { intlayer } from "vite-intlayer";
|
|
141
141
|
import { defineConfig } from "vite";
|
|
142
142
|
import { devtools } from "@tanstack/devtools-vite";
|
|
143
|
-
import viteTsConfigPaths from "vite-tsconfig-paths";
|
|
144
143
|
import { tanstackStart } from "@tanstack/solid-start/plugin/vite";
|
|
145
144
|
import solidPlugin from "vite-plugin-solid";
|
|
146
145
|
|
|
147
146
|
export default defineConfig({
|
|
148
147
|
plugins: [
|
|
149
148
|
devtools(),
|
|
150
|
-
viteTsConfigPaths({
|
|
151
|
-
projects: ["./tsconfig.json"],
|
|
152
|
-
}),
|
|
153
149
|
tanstackStart({
|
|
154
150
|
router: {
|
|
155
151
|
routeFileIgnorePattern:
|
|
@@ -221,9 +217,6 @@ function RootComponent() {
|
|
|
221
217
|
}
|
|
222
218
|
```
|
|
223
219
|
|
|
224
|
-
> [!NOTE]
|
|
225
|
-
> Solid'de, `useMatches` bir **signal** (reaktif erişimci) döndürür. Geçerli değere reaktif olarak erişmek için `matches()` (parantezli) kullanın.
|
|
226
|
-
|
|
227
220
|
### Adım 6: Yerel Ayar Düzeni Oluşturma (İsteğe Bağlı)
|
|
228
221
|
|
|
229
222
|
Yerel ayar önekini işleyen ve doğrulama gerçekleştiren bir düzen oluşturun. Bu düzen, yalnızca geçerli yerel ayarların işlenmesini sağlayacaktır.
|
|
@@ -416,7 +409,6 @@ function RouteComponent() {
|
|
|
416
409
|
}
|
|
417
410
|
```
|
|
418
411
|
|
|
419
|
-
> [!NOTE]
|
|
420
412
|
> Solid'de, `useIntlayer` bir **accessor** fonksiyonu (ör: `content()`) döndürür. Reaktif içeriğe erişmek için bu fonksiyonu çağırmalısınız.
|
|
421
413
|
>
|
|
422
414
|
> `useIntlayer` hook'u hakkında daha fazla bilgi edinmek için [dokümantasyon](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/packages/solid-intlayer/useIntlayer.md)a bakın.
|
|
@@ -461,7 +453,6 @@ export const LocaleSwitcher = () => {
|
|
|
461
453
|
export default LocaleSwitcher;
|
|
462
454
|
```
|
|
463
455
|
|
|
464
|
-
> [!NOTE]
|
|
465
456
|
> Solid'de, `useLocale`dan gelen `locale` bir **signal accessor**'dur. Reaktif olarak geçerli değerini okumak için `locale()` (parantezli) kullanın.
|
|
466
457
|
>
|
|
467
458
|
> `useLocale` hook'u hakkında daha fazla bilgi edinmek için [dokümantasyon](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/packages/solid-intlayer/useLocale.md)a bakın.
|
|
@@ -503,15 +494,11 @@ import solid from "vite-plugin-solid";
|
|
|
503
494
|
import { nitro } from "nitro/vite";
|
|
504
495
|
import { defineConfig } from "vite";
|
|
505
496
|
import { intlayer, intlayerProxy } from "vite-intlayer";
|
|
506
|
-
import viteTsConfigPaths from "vite-tsconfig-paths";
|
|
507
497
|
|
|
508
498
|
export default defineConfig({
|
|
509
499
|
plugins: [
|
|
510
500
|
intlayerProxy(), // Nitro kullanıyorsanız Proxy sunucudan önce yerleştirilmelidir
|
|
511
501
|
nitro(),
|
|
512
|
-
viteTsConfigPaths({
|
|
513
|
-
projects: ["./tsconfig.json"],
|
|
514
|
-
}),
|
|
515
502
|
intlayer(),
|
|
516
503
|
tanstackStart({
|
|
517
504
|
router: {
|
|
@@ -804,16 +791,12 @@ bun x intlayer extract
|
|
|
804
791
|
import { intlayer, intlayerCompiler } from "vite-intlayer";
|
|
805
792
|
import { defineConfig } from "vite";
|
|
806
793
|
import { devtools } from "@tanstack/devtools-vite";
|
|
807
|
-
import viteTsConfigPaths from "vite-tsconfig-paths";
|
|
808
794
|
import { tanstackStart } from "@tanstack/solid-start/plugin/vite";
|
|
809
795
|
import solidPlugin from "vite-plugin-solid";
|
|
810
796
|
|
|
811
797
|
export default defineConfig({
|
|
812
798
|
plugins: [
|
|
813
799
|
devtools(),
|
|
814
|
-
viteTsConfigPaths({
|
|
815
|
-
projects: ["./tsconfig.json"],
|
|
816
|
-
}),
|
|
817
800
|
tanstackStart({
|
|
818
801
|
router: {
|
|
819
802
|
routeFileIgnorePattern:
|
|
@@ -160,14 +160,10 @@ import viteReact from "@vitejs/plugin-react";
|
|
|
160
160
|
import { nitro } from "nitro/vite";
|
|
161
161
|
import { defineConfig } from "vite";
|
|
162
162
|
import { intlayer } from "vite-intlayer";
|
|
163
|
-
import viteTsConfigPaths from "vite-tsconfig-paths";
|
|
164
163
|
|
|
165
164
|
const config = defineConfig({
|
|
166
165
|
plugins: [
|
|
167
166
|
nitro(),
|
|
168
|
-
viteTsConfigPaths({
|
|
169
|
-
projects: ["./tsconfig.json"],
|
|
170
|
-
}),
|
|
171
167
|
intlayer(),
|
|
172
168
|
tanstackStart({
|
|
173
169
|
router: {
|
|
@@ -593,15 +589,11 @@ import viteReact from "@vitejs/plugin-react";
|
|
|
593
589
|
import { nitro } from "nitro/vite";
|
|
594
590
|
import { defineConfig } from "vite";
|
|
595
591
|
import { intlayer, intlayerProxy } from "vite-intlayer";
|
|
596
|
-
import viteTsConfigPaths from "vite-tsconfig-paths";
|
|
597
592
|
|
|
598
593
|
export default defineConfig({
|
|
599
594
|
plugins: [
|
|
600
595
|
intlayerProxy(), // Nitro kullanıyorsanız, proxy sunucudan önce yerleştirilmelidir
|
|
601
596
|
nitro(),
|
|
602
|
-
viteTsConfigPaths({
|
|
603
|
-
projects: ["./tsconfig.json"],
|
|
604
|
-
}),
|
|
605
597
|
intlayer(),
|
|
606
598
|
tanstackStart({
|
|
607
599
|
router: {
|
|
@@ -409,7 +409,6 @@ export class MyElement extends LitElement {
|
|
|
409
409
|
}
|
|
410
410
|
```
|
|
411
411
|
|
|
412
|
-
> [!NOTE]
|
|
413
412
|
> Yerel bir HTML özniteliğinde (örneğin `alt`, `aria-label`, `title`) çevrilmiş dizeye ihtiyacınız olduğunda, yaprak düğüm üzerinde `.value` işlevini çağırın:
|
|
414
413
|
>
|
|
415
414
|
> ```typescript
|
|
@@ -312,7 +312,6 @@ const App: Component = () => (
|
|
|
312
312
|
export default App;
|
|
313
313
|
```
|
|
314
314
|
|
|
315
|
-
> [!NOTE]
|
|
316
315
|
> Solid'de, `useIntlayer` bir **accessor** fonksiyonu döndürür (ör. `content()`). Reaktif içeriğe erişmek için bu fonksiyonu çağırmanız gerekir.
|
|
317
316
|
|
|
318
317
|
> İçeriğinizi `alt`, `title`, `href`, `aria-label` gibi bir `string` özniteliğinde kullanmak istiyorsanız, fonksiyonun değerini şu şekilde çağırmanız gerekir:
|
|
@@ -232,7 +232,7 @@ module.exports = appContent;
|
|
|
232
232
|
<!-- İçeriği basit içerik olarak render et -->
|
|
233
233
|
<h1>{$content.title}</h1>
|
|
234
234
|
<!-- İçeriği editör kullanarak düzenlenebilir şekilde render etmek için -->
|
|
235
|
-
<h1
|
|
235
|
+
<h1>{@const Title = $content.title}<Title /></h1>
|
|
236
236
|
<!-- İçeriği string olarak render etmek için -->
|
|
237
237
|
<div aria-label={$content.title.value}></div>
|
|
238
238
|
|
|
@@ -184,10 +184,9 @@ module.exports = config;
|
|
|
184
184
|
import { reactRouter } from "@react-router/dev/vite";
|
|
185
185
|
import { defineConfig } from "vite";
|
|
186
186
|
import { intlayer } from "vite-intlayer";
|
|
187
|
-
import tsconfigPaths from "vite-tsconfig-paths";
|
|
188
187
|
|
|
189
188
|
export default defineConfig({
|
|
190
|
-
plugins: [reactRouter(),
|
|
189
|
+
plugins: [reactRouter(), intlayer()],
|
|
191
190
|
});
|
|
192
191
|
```
|
|
193
192
|
|