При запуске нового проекта React Native с помощью команды react-native initсервер разработки по умолчанию работает на порту 8081. Однако могут возникнуть ситуации, когда вам необходимо изменить порт по разным причинам., например конфликты с другими службами или сетевые ограничения. В этой статье мы рассмотрим несколько способов изменения порта для проекта React Native, а также приведем примеры кода.

Метод 1: переменная среды

Один из способов изменить порт — установить переменную среды RCT_METRO_PORTперед запуском проекта. Это указывает серверу разработки использовать другой порт. Выполните следующую команду в корневом каталоге вашего проекта:

export RCT_METRO_PORT=8082

Метод 2. Конфигурация Metro

Metro Bundler — это сервер разработки по умолчанию для проектов React Native. Вы можете изменить его конфигурацию, чтобы изменить порт. Создайте файл metro.config.jsв корневом каталоге проекта (если он не существует) и добавьте следующий код:

module.exports = {
  server: {
    port: 8082,
  },
};

Метод 3: аргумент командной строки

Вы также можете указать порт непосредственно в качестве аргумента командной строки при запуске сервера разработки. Используйте флаг --port, за которым следует желаемый номер порта. Пример:

npx react-native start --port 8082

Метод 4: React Native Config

Если вы используете пакет react-native-config, вы можете изменить файл конфигурации, чтобы изменить порт. Откройте файл .envв корневом каталоге вашего проекта и добавьте следующую строку:

METRO_PORT=8082

Метод 5: настройка React Native CLI

Если вы используете React Native CLI, вы можете изменить файл конфигурации, чтобы изменить порт. Откройте файл metro.config.jsв корневом каталоге вашего проекта и добавьте следующий код:

module.exports = {
  resolver: {
    resolverMainFields: ['react-native', 'browser', 'main'],
  },
  server: {
    port: 8082,
  },
};

В этой статье мы рассмотрели несколько способов изменения порта по умолчанию для проекта React Native. Используя переменные среды, конфигурацию Metro, аргументы командной строки, конфигурацию React Native Config или конфигурацию React Native CLI, вы можете легко настроить порт в соответствии со своими требованиями. Выберите метод, который лучше всего соответствует настройке вашего проекта, и наслаждайтесь разработкой приложения React Native на нужном порту.