# gt-next: General Translation Next.js SDK: Локальное хранение переводов
URL: https://generaltranslation.com/ru/docs/next/guides/local-tx.mdx
---
title: Локальное хранение переводов
description: Храните переводы в составе бандла приложения, а не через CDN
---

## Что такое локальные переводы?

Локальные переводы хранятся в составе бандла вашего приложения, а не загружаются из CDN (Content Distribution Network). Когда вы добавляете команду `gt translate` в процесс сборки, она генерирует переводы в формате JSON. Последний шаг — поместить эти переводы в приложение, чтобы их можно было использовать.

Сделать это можно двумя способами:

1. **В составе бандла приложения** (локально): сохранять переводы в бандле приложения после генерации
2. **В CDN** (по умолчанию): загружать переводы из CDN во время выполнения

По умолчанию `gt-next` загружает переводы из CDN General Translation. Когда вы переводите приложение с помощью нашего API, переводы автоматически сохраняются в нашем CDN.

<Callout>
  **Поведение по умолчанию:** GT по умолчанию использует CDN. Переходите на локальное хранилище только в том случае, если вам действительно нужны его преимущества.
</Callout>

## Компромиссы

### Преимущества локальных переводов

* **Более быстрая загрузка**: Локальные переводы отдаются напрямую из вашего приложения и загружаются быстрее, чем переводы с CDN
* **Нет зависимости от внешних сервисов**: Возможность вашего приложения загружать переводы не зависит от доступности CDN. Если для локали переводы не найдены, приложение автоматически переключается на язык по умолчанию
* **Работает офлайн**: Переводы входят в состав вашего приложения

### Недостатки локальных переводов

* **Увеличение размера бандла**: Локальные переводы увеличивают размер бандла приложения, из-за чего оно может медленнее загружаться при первом запуске
* **Управление контентом**: Чтобы изменить перевод, вам придется заново разворачивать приложение с обновлённым переводом при каждом изменении

## Сетап

### Шаг 1: Создайте функцию loadTranslations

Добавьте файл `loadTranslations.[js|ts]` в каталог `./src` со следующим содержимым:

```ts title="src/loadTranslations.ts"
export default async function loadTranslations(locale: string) {
  const translations = await import(`../public/_gt/${locale}.json`);
  return translations.default;
}
```

[`withGTConfig`](/docs/next/api/config/with-gt-config) автоматически находит файл `loadTranslations.[js|ts]` в каталоге `src/` или в корне проекта.


### Шаг 2: Настройте CLI

Выполните команду настройки и выберите локальное хранение:

```bash
npx gt configure
```

Когда появится запрос:

* **Сохранить в CDN?** Выберите &quot;No&quot;
* **Каталог переводов:** Введите `./public/_gt`

Также можно вручную настроить файл `gt.config.json` для использования локальных переводов. Подробнее см. в [документации по настройке CLI](/docs/cli/reference/config).


### Шаг 3: Сгенерируйте переводы

Теперь при запуске команды `translate` переводы будут автоматически загружаться и включаться в вашу базу кода:

```bash
npx gt translate
```

Переводы будут храниться в `public/_gt/` и входить в бандл вашего приложения.


## Интеграция в процесс сборки

### Процесс сборки в Next.js

Добавьте генерацию переводов в скрипт сборки:

```json
{
  "scripts": {
    "build": "npx gt translate && <...YOUR_BUILD_COMMAND...>"
  }
}
```


### Пайплайн CI/CD

```yaml
# .github/workflows/deploy.yml
- name: Generate Translations
  run: npx gt translate
  
- name: Build Application  
  run: npm run build
```


## Распространённые проблемы

### Отсутствуют файлы переводов

Убедитесь, что переводы сгенерированы до сборки:

```bash
# ❌ Сборка без переводов
<...YOUR_BUILD_COMMAND...>

# ✅ Сначала сгенерируйте переводы
npx gt translate && <...YOUR_BUILD_COMMAND...>
```


### Ошибки пути импорта

Приведите структуру каталогов в funzione loadTranslations в соответствие:

```ts
// ❌ Неверный путь
const t = await import(`../translations/${locale}.json`);

// ✅ Правильный путь для public/_gt
const t = await import(`../public/_gt/${locale}.json`);
```


### Большой размер бандла

Используйте разделение кода, если приложение поддерживает много языков:

```ts
// Загружать переводы только при необходимости
export default async function loadTranslations(locale: string) {
  // Загружать только если локаль активна
  if (locale === getCurrentLocale()) {
    const translations = await import(`../public/_gt/${locale}.json`);
    return translations.default;
  }
  return {};
}
```

<Callout>
  Локальное хранение лучше всего подходит для приложений со стабильными переводами, которым не требуются частые обновления.
</Callout>


## Что дальше

* [Руководство по Middleware](/docs/next/guides/middleware) - Определение языка и маршрутизация
* [Руководство по языкам](/docs/next/guides/languages) - Настройка поддерживаемых языков
* Справка по API: