# react-native: Миграция
URL: https://generaltranslation.com/ru/docs/react-native/guides/migration.mdx
---
title: Миграция
description: Узнайте, как мигрировать проект на gt-react-native
---

{/* АВТОМАТИЧЕСКИ СГЕНЕРИРОВАНО: Не редактируйте напрямую. Вместо этого измените шаблон в content/docs-templates/. */}


## Обзор

В этом руководстве описаны шаги, необходимые для миграции проекта, который уже использует библиотеку i18n, на `gt-react-native`.

Мы также дадим несколько советов и рекомендаций, которые помогут сделать эту миграцию максимально простой.

## Предварительные требования

* Проект, в котором сейчас используется другая библиотека i18n.
* Базовое понимание библиотеки `gt-react-native`.

## Зачем мигрировать?

Есть много причин, по которым стоит мигрировать проект на `gt-react-native`.

Вот лишь некоторые из них:

* **Больше никаких JSON-файлов:** Вам больше не придется управлять переводами в JSON-файлах.
  Весь ваш контент находится прямо в коде — там, где ему и место.
* **Автоматические переводы:** Создавайте качественные переводы с учетом контекста с помощью нашего CLI-инструмента.
  Вам больше не придется ждать переводов.
* **Экспериментируйте в dev:** Легко тестируйте переводы в процессе разработки благодаря горячей перезагрузке переводов.

## Настройка

<Steps>
  <Step>
    Установите `gt-react-native` и CLI-инструмент `gt`.

    <Tabs items={['npm', 'yarn', 'bun', 'pnpm']}>
      <Tab value="npm">
        ```bash
        npm i gt-react-native
        npm i gt
        ```
      </Tab>

      <Tab value="yarn">
        ```bash
        yarn add gt-react-native
        yarn add --dev gt
        ```
      </Tab>

      <Tab value="bun">
        ```bash
        bun add gt-react-native
        bun add --dev gt
        ```
      </Tab>

      <Tab value="pnpm">
        ```bash
        pnpm add gt-react-native
        pnpm add --save-dev gt
        ```
      </Tab>
    </Tabs>
  </Step>

  <Step>
    Создайте в корне проекта файл `gt.config.json`, содержащий свойство `defaultLocale` и массив `locales`.

    ```json title="gt.config.json" copy
    {
      "defaultLocale": "en",
      "locales": ["en", "fr", "es"]
    }
    ```

    Добавьте компонент `<GTProvider>` в корневой компонент приложения и передайте объект `config` в пропсы с помощью spread-оператора.

    ```tsx
    import { GTProvider } from 'gt-react-native'
    import config from './gt.config.json'

    <GTProvider {...config}>
      <App />
    </GTProvider>
    ```

    Более подробные инструкции см. в руководстве [по быстрому старту проекта](/docs/react-native).
  </Step>

  <Step>
    На этом этапе у вас есть 3 варианта:

    1. Полностью мигрировать весь проект на `gt-react-native` и удалить старую библиотеку i18n.
    2. Полностью мигрировать проект, но продолжить использовать словари из старой библиотеки i18n.
    3. Пока оставить старую библиотеку i18n и мигрировать на `gt-react-native` только часть проекта.

    Подробнее о каждом варианте см. в разделе [стратегии миграции](#strategies).
  </Step>
</Steps>

## Стратегии миграции [#strategies]

### Вариант 1: Полностью перенесите весь проект

Это самый простой вариант, но он также потребует больше всего изменений в коде за раз.

После настройки проекта вам нужно будет найти все вхождения старой библиотеки i18n и заменить их на `gt-react-native`.

Если ваше приложение использует React-хуки, такие как `useTranslation`, найдите все вхождения `useTranslation` в кодовой базе и замените их на `useGT`.

Затем вам нужно будет заменить все строковые ключи их фактическими строковыми значениями.

Например, если ваш старый код выглядит так:

```json title="dictionary.json"
{
  "hello": {
    "description": "Hello, world!"
  }
}
```

```tsx
export default function MyComponent() {
  const { t } = useTranslation()
  return <div>{t('hello.description')}</div>
}
```

Вам нужно заменить это на:

```tsx
export default function MyComponent() {
  const { t } = useGT()
  return <div>{t('Hello, world!')}</div>
}
// ИЛИ
export default function MyComponent() {
  return <T>Hello, world!</T>
}
```

Сделайте это во всех местах, где используется ваша старая библиотека i18n.


### Вариант 2: Полностью мигрируйте проект на новую систему, но продолжайте использовать словари из старой библиотеки i18n

Допустим, вы хотите мигрировать свой проект на `gt-react-native`, но при этом сохранить использование словарей из старой библиотеки i18n
и применять встроенные возможности GT только для нового контента.

В этом случае можно поступить примерно так же, как в варианте 1:

Найдите все места, где используется старая библиотека i18n, например хуки `useTranslation`, и замените их на `useTranslations`.

Хук `useTranslations` работает почти так же, как `useTranslation`, поэтому использовать его можно аналогичным образом.

<Tabs items={['Before', 'After']}>
  <Tab value="Before">
    ```tsx
    import { useTranslation } from 'react-i18next'
    export default function MyComponent() {
      const { t } = useTranslation()
      return <div>{t('hello.description')}</div>
    }
    ```
  </Tab>

  <Tab value="After">
    ```tsx
    import { useTranslations } from 'gt-react-native'
    export default function MyComponent() {
      const t = useTranslations()
      return <div>{t('hello.description')}</div>
    }
    ```
  </Tab>
</Tabs>

Что касается конфигурации, вам нужно создать файл `dictionary.[js|ts|json]` в корне проекта или в каталоге `src`.
Скопируйте в него содержимое старого файла словаря, а затем передайте его в компонент `GTProvider`.

```tsx
import { GTProvider } from 'gt-react-native'
import dictionary from './dictionary.json'
import config from './gt.config.json'

<GTProvider {...config} dictionary={dictionary}>
  <App />
</GTProvider>
```

Подробнее см. в руководстве [dictionaries](/docs/react-native/guides/dictionaries).


### Вариант 3: Пока продолжайте использовать старую библиотеку i18n и мигрируйте в `gt-react-native` только часть проекта

Этот вариант самый гибкий и потребует минимальных изменений в коде за один раз.

В этом случае можно поступить аналогично варианту 2, но мигрировать в `gt-react-native` только часть проекта.

Например, вы можете оставить старую библиотеку i18n для одних компонентов, а `gt-react-native` использовать только для других и для нового контента.

<Callout type="warn">
  Этот вариант не рекомендуется, так как вам придется поддерживать в проекте две разные библиотеки i18n, а это может быть сложно и привести к ошибкам.
</Callout>

## Советы по миграции

### 1. По возможности используйте хук `useGT` или компонент `<T>`

По возможности рекомендуем использовать хук `useGT` или компонент `<T>`.

Это значительно упростит редактирование контента в будущем и сделает кодовую базу намного понятнее.

### 2. Используйте хук `useTranslations` для существующего контента

Хук `useTranslations` позволяет и дальше использовать существующие словари.

Мы предлагаем его, чтобы упростить миграцию, но не рекомендуем использовать его для нового контента.

### 3. Использование ИИ

Если вы используете ИИ, чтобы упростить миграцию проекта, у нас есть файлы `LLMs.txt` и `LLMs-full.txt`, доступные по адресам:

* [LLMs.txt](/llms.txt)
* [LLMs-full.txt](/llms-full.txt)

Эти файлы содержат полный текст этой документации, поэтому ваш ИИ-инструмент получит доступ ко всей информации, необходимой для миграции проекта.