Невозможно загрузить скрипт. Убедитесь, что вы используете сервер Metro или что ваш пакет 'index.android.bundle' правильно упакован для выпуска

161

react-native run-androidКоманда заканчивается, оставив сообщение в симуляторе Android. Сообщение выглядит следующим образом:

Невозможно загрузить скрипт. Убедитесь, что вы используете сервер Metro или что ваш пакет 'index.android.bundle' правильно упакован для выпуска.

Скриншот

Что я делаю не так?

Belle Solutions
источник
вы можете попробовать эту ссылку stackoverflow.com/questions/32572399/… ?
errorau
5
У меня та же проблема, потому что мое устройство не подключено к Интернету.
Хо Чхунленг
Эта ошибка приходит: throw er; // Необработанное событие «ошибка»
Saeed
я нашел его и положил на него stackoverflow.com/a/58570426/6852210
Алиреза
@Belle Solution, вы нашли какое-нибудь решение?
Hitesh

Ответы:

96

Вы еще не запустили пакет Запустите npm startили react-native startв корневом каталоге вашего проекта раньше react-native run-android.

Nerdragen
источник
сначала я запускаю реактивный запуск, но при запуске реактивного запуска-android он завершается после успешной сборки
Belle Solutions
12
Вы должны иметь консоль с двумя узлами, работающую одновременно. Один запускает и запускает упаковщик, другой запускает эмулятор.
Нердраген
27
Для меня эта ошибка появляется, даже если пакет запущен.
П.Лоран и
2
Убедитесь, что порт 8081 не заблокирован. Кроме того, убедитесь, что вы используете один терминал для запуска упаковщика, подождите, пока он завершит загрузку графа зависимостей, а затем запустите response-native run-android на другом терминале.
Нердраген
1
В Windows это работает само по себе, но в Linux это не так, спасибо! Работай отлично!
Адриан Серна
62

Эти шаги действительно помогают мне:

Шаг 1: Создайте каталог в android / app / src / main / assets

Команда Linux :mkdir android/app/src/main/assets

Шаг 2: Переименуйте index.android.js(в корневом каталоге) в index.js( Возможно, есть index.jsфайл, в этом случае вам не нужно его переименовывать ), затем выполните следующую команду:

react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

Шаг 3: Создайте свой APK:react-native run-android

Пожалуйста, используйте index.js в последней версии.

Наслаждаться :)

Saeed
источник
Каково расположение этого файла в реагирующем собственном проекте index.android.j
Arbaz.in
@ Arbaz.in в корневом каталоге.
Саид
@ Arbaz.in Возможно, index.jsв корневом каталоге есть файл, и вам не нужно его переименовывать
Saeed
@Saeed да нашел его
Arbaz.in
4
Это может только запустить приложение на данный момент, но как это включит отладку и горячую загрузку? это не идеальное решение для достижения этой цели.
Будда
39

Для меня эта ошибка была вызвана обновлением реагировать на родной

Начиная с Android 9.0 (уровень API 28), поддержка открытого текста по умолчанию отключена.

Если вы посмотрите обновление diff, вам нужно создать манифест отладки. android/app/src/debug/AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
    <application android:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" />
</manifest>

См. Для получения дополнительной информации: https://stackoverflow.com/a/50834600/1713216

https://react-native-community.github.io/upgrade-helper/

Том
источник
1
Работал у меня на RN 0.61.3.
Żabojad
2
К сожалению, это не сработало для меня. У меня уже было это, и я все еще получаю ту же ошибку, хотя Metro Bundler работает.
Андрей
Я обнаружил, что иногда мне нужны дополнительные переопределения, если у меня определен networkSecurityConfig, но, похоже, эти настройки всегда вызывают проблемы для меня. Вы можете попробовать удалить любую конфигурацию безопасности и указать android:usesCleartextTraffic="true"в основном, AndroidManifest.xmlпосмотреть, работает ли это?
Том
Это сработало для меня на RN 0,62
KevinAdu
У меня есть все эти настройки, включая android: usedCleartextTraffic = "true", но я все еще не могу запустить приложение на реальном устройстве.
Lucky_girl
18

Вы можете попробовать следующее:

Добавьте эту строку в свой AndroidManifest.xml

<application
[...]
android:usesCleartextTraffic="true"
/>
[...]
</application>
tinmarfrutos
источник
18

Подобная проблема произошла со мной.
Видимо Mcafee блокирует порт 8081. Мне понадобились часы, чтобы понять это.

Попробуйте запустить:

react-native run-android --port=1234

Когда приложение отображается с ошибкой на эмуляторе, зайдите в настройки dev ( Ctrl+ M).

Измените «Отладочный сервер и порт для устройства» на «localhost: 1234».

Закройте приложение и запустите его из ящика приложения.

Навин Кумар
источник
1
спасибо за подсказку, мне пришлось открыть порт 8081 в моем брандмауэре, и он начал работать
ukie
Большое спасибо за это. Если у вас есть Mcafee, я бы попробовал это, у меня это сработало.
Пуэрто
Спасибо, спас мой проект
Rafid
Я застрял здесь на два дня, никогда бы не подумал, что это заблокированный порт! Большое спасибо!
П. Наум
Я попытался поразить localhost: 8081 в браузере, но не повезло. Небольшое исследование и выяснили, что макафи заблокировал этот порт. Следовал твоему пути. Начал работать на отлично.
Тушар Джаджодиа
18

Сначала выполните шаги 4 и 5, затем вы можете запустить свой проект. Если вы не получили результат (с шагами 4 и 5), выполните следующие шаги

1- Попробуйте понизить версию своего узла (текущая версия 12.13.1)

  choco uninstall nodejs
  choco install nodejs --version 12.8

2- Добавьте путь npm module ( C:\Users\your user name\AppData\Roaming\npm) к системным переменным вместо пользовательских переменных.

3- Установить реакцию глобально с помощью команды

  npm install -g react-native-cli

4- Перейдите в корневой каталог вашего проекта и выполните следующую команду:

  react-native start

5- Откройте другой терминал в корне вашего проекта и выполните следующую команду:

   react-native run-android 

РЕДАКТИРОВАТЬ :

Вы используете Genymotion? Если да, сделайте следующий шаг:

После вышеуказанного шага, если вы получаете следующую ошибку?

error Failed to launch emulator. Reason: No emulators found as an output of `emulator -list-avds`.

Откройте свой гений и перейдите по адресу:

genymotion menu -> Settings -> ADB -> Затем выберитеuse custom android sdk tools (нажмите, чтобы найти местоположение SDK)

Наконец, запустите свой проект снова ..

AbolfazlR
источник
1
12.9 также работает для меня, спасибо, я обновился до версии 12.13.x и начал получать вышеуказанную проблему.
Хьюи Матарьюс
Предпосылки к этому ответу: github.com/facebook/react-native/issues/26598
Кристиан Давен
17

просто добавьте три заставки: node_modules \ metro-config \ src \ defaults \ blacklist.js

замените эту часть:

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];
Алиреза
источник
12

если у вас все настроено правильно, попробуйте это:

ADB обратный протокол: 8081 протокол: 8081

Зачем? «Когда RN-упаковщик работает, в вашем браузере доступен активный веб-сервер по адресу 127.0.0.1:8081. Именно с этого сервера JS-пакет для вашего приложения обслуживается и обновляется по мере внесения изменений. Без обратного прокси-сервера Ваш телефон не сможет подключиться к этому адресу. "

все кредиты Swingline0

Туа Тара
источник
Не могли бы вы добавить в свой ответ, почему это должно работать и что делает эта команда?
CreyD
провел весь день, пытаясь переключать библиотеки, и это было моей проблемой
Адам Кац
10

[Быстрый ответ]

После попытки решить эту проблему в моем рабочем пространстве я нашел решение.

Эта ошибка вызвана тем, что существует проблема с Metro, использующим некоторые комбинации версии NPM и Node.

У вас есть 2 варианта:

  • Альтернатива 1: Попробуйте обновить или понизить npm и версию узла.
  • Альтернатива 2: перейдите к этому файлу: \node_modules\metro-config\src\defaults\blacklist.jsи измените этот код:

    var sharedBlacklist = [
      /node_modules[/\\]react[/\\]dist[/\\].*/,
      /website\/node_modules\/.*/,
      /heapCapture\/bundle\.js/,
      /.*\/__tests__\/.*/
    ];

    и изменить на это:

    var sharedBlacklist = [
      /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
      /website\/node_modules\/.*/,
      /heapCapture\/bundle\.js/,
      /.*\/__tests__\/.*/
    ];

    Обратите внимание, что если вы запускаете npm installили, yarn installвам нужно снова изменить код.

Хавьер С.
источник
8

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

В файле node_modules\metro-config\src\defaults\blacklist.js

Заменить:

var sharedBlacklist = [
  /node_modules[/\\]react[/\\]dist[/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];

с участием :

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];

надеюсь это поможет.

Мангалпрада Малая
источник
Работал как шарм, спасибо
Сезар Бермудес
У меня тоже сработало. Но почему я должен был это исправить? Что пошло не так?
Машрур
Судя по всему, metro-configиспользовал \ для путей вместо /, который этот ответ предлагает изменить. Не делай этого . Изменение пакетов npm означает, что вся ваша команда должна делать это на своем компьютере, в CI, на стадии подготовки, на производстве и каждый раз, когда metro-config выпускает обновление. Лучший подход заключается в том, чтобы раскошелиться на metro-config на GitHub, зафиксировать исправление, отправить и отправить PR, чтобы исправить это для всех.
Кэмерон Уилби
6

Начиная с Android 9.0 (уровень API 28), поддержка открытого текста по умолчанию отключена.

Это то, что вам нужно сделать, чтобы избавиться от этой проблемы, если вы правильно выполняете команды запуска

  1. установка npm
  2. реактивно-родное начало
  3. реагировать-родной запуск андроид

И измените свой файл манифеста Android, как это.

<application
    android:name=".MainApplication"
    android:icon="@mipmap/ic_launcher"
    android:usesCleartextTraffic="true" // add this line with TRUE Value.
android:theme="@style/AppTheme">
MD. Шафиул Алам Биплоб
источник
5

После нескольких часов в поисках ответа. Решением было сделать узел понижения до версии 12.4.

В моем случае я понимаю, что ошибка только что происходит в версии реакции 0,60 с версией узла 12,6.

Виктор Араужо
источник
4

Мое решение этого, как показано ниже:

Запустить Metro сервер

$ react-native start

Запустить Android

$ react-native run-android

Если вы видите сообщение об ошибке «порт 8081 уже используется», вы можете завершить этот процесс и запустить его снова.

$ react-native start

См. React Native Страница устранения неполадок .

Shizhen
источник
4

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

npm start

затем откройте другое окно терминала и запустите:

react-native run-android
Solomon Njobvu
источник
3

Я просто хочу добавить неочевидную возможность, не описанную здесь. Я использую @ response-native-community / netinfo для обнаружения сетевых изменений, в первую очередь состояния сети. Чтобы проверить состояние отключения сети, переключатель WIFI (на эмуляторе) необходимо отключить. Это также эффективно отсекает мост между эмулятором и средой отладки. Я не включил WIFI после тестов, так как был далеко от компьютера и сразу же забыл об этом, когда вернулся.

Существует вероятность того, что это может иметь место и для кого-то другого, и его стоит проверить, прежде чем предпринимать какие-либо другие радикальные шаги.

arunmenon
источник
3

У меня возникла та же проблема, проблема для меня заключалась в том, что adb был не в правильном пути к среде, ошибка говорит вам о том, что порт метро, ​​а вы в adb, порты убиты и перезапущены.

Добавить переменную среды (ADB)

  1. Переменные открытой среды
  2. Выберите во втором кадре переменную PATH и щелкните опцию редактирования ниже
  3. Нажмите на опцию добавить
  4. Отправьте путь инструментов платформы SDK C: \ Users \ Мой пользователь \ AppData \ Local \ Android \ Sdk \ platform-tools

Примечание : или в зависимости от того, где находится adb.exe на вашем компьютере

  1. Сохранить изменения

Запустите сборку Android снова

$ react-native run-android

Или

$ react-native start

$ react-native run-android
CarlosChavarria
источник
3

Я тоже сталкивался с этой проблемой. Я решил этот следующий шаг.

Проверьте Android SDK путь в среде Veritable.

Добавить ANDROID_HOME = C:\Users\user_name\AppData\Local\Android\Sdkв системную переменную
и C:\Users\user_name\AppData\Local\Android\Sdk\platform-toolsпуть в системной переменной

замените sharedBlacklist как сегмент кода ниже,

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];

в node_modules / metro-config / src / default / blacklist.js

Затем запустите NPC реагировать родной запустить-Android - порт 9001

Удачного кодирования!

Чанака
источник
2

Я испытал это только потому, что мой Wi-Fi был по ошибке выключен на моем эмуляторе. Я включил его, и он начал работать нормально. Надеюсь, это кому-нибудь пригодится

Лесная баба
источник
2

Возможность этой ошибки также неверный путь, проверьте один раз

 export ANDROID_HOME=/Users/microrentindia/Library/Android/sdk/
 export PATH=$PATH:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools
user3143487
источник
Никогда не думал об этом. Но это был ответ для меня.
Сирадж Алам
2

Решение, которое сработало для меня, заключается в следующем:

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
]; 

Мой пример кода

Хорхе Сантос Нил
источник
2

обновить эту часть в черном списке метро

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];
Хазем АбдельХамид
источник
2

Я столкнулся с той же проблемой, когда следовал учебному пособию по React Native (разработка для Linux и ориентация на Android).

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

  1. (в каталоге проекта) mkdir android/app/src/main/assets
  2. react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
  3. react-native run-android

Вы можете автоматизировать вышеуказанные шаги, помещая их в scriptsчасти , package.jsonкак это:

"android-linux": "react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res && react-native run-android"

Тогда вы можете просто выполнить npm run android-linuxиз командной строки каждый раз.

cracknut
источник
1

По умолчанию крошечный сервер JavaScript с именем «Metro Server» работает на порту 8081.

Вам нужно сделать этот порт доступным для запуска этого Сервера. Так,

  1. освободить порт
  2. закройте ваше виртуальное устройство
  3. "Реакция-родной запуск-андроид" снова.

Как освободить порт?

http://tenbull.blogspot.com/2019/05/how-to-kill-process-currently-using.html

Как убить процесс в настоящее время, используя порт на локальном хосте в Windows?

и что наиболее важно, я обновил версию своего узла с 8.x до 10.x (последняя версия), как предложено facebook @ https://facebook.github.io/react-native/docs/getting-started

Картик Н
источник
1

Для меня эта проблема началась с апгрейда реактив-родной. Обновление было необходимо, чтобы добавить 64-битную поддержку.

Before:
-------- 
Environment:
Node: 10.15.0
npm: 6.9.0
Watchman: 4.9.0
Xcode: Not Found
Android Studio: 3.4 AI-183.6156.11.34.5692245

Packages: (wanted => installed)
react: 16.0.0-alpha.12 => 16.0.0-alpha.12
react-native: ~0.55.2 => 0.55.4
react-native-cli: 2.0.1

After:
------
info 
React Native Environment Info:
Binaries:
Node: 10.15.0
npm: 6.9.0
Watchman: 4.9.0
SDKs:
Android SDK:
API Levels: 23, 26, 27, 28
Build Tools: 27.0.3, 28.0.3
System Images: android-28 | Google APIs Intel x86 Atom
IDEs:
Android Studio: 3.4 AI-183.6156.11.34.5692245
Xcode: /undefined - /usr/bin/xcodebuild
npmPackages:
react: ^16.8.6 => 16.9.0 
react-native: 0.59.9 => 0.59.9 
npmGlobalPackages:
create-react-native-app: 2.0.2
react-native-cli: 2.0.1

Кроме того, одно важное изменение, которое я сделал для обновления, было в ../android/build/build.gradle

android {
    ...
    defaultConfig {
        ...
        targetSdkVersion 28
        ...
    }
    ...
}

Мне пришлось изменить targetSdkVersion с 27 на 28 после предупреждения, когда я пытался загрузить сборку (.apk) в консоль goole play. Мало ли я понял, что это было основной причиной вышеуказанной ошибки для меня. Сразу же ответы @tom и @tinmarfrutos имели абсолютный смысл.

Я решил проблему, добавив Android: usedCleartextTraffic = "true" в мой android / app / src / debug / AndroidManifest.xml

vivekkan
источник
1

В моем случае я установил прокси в моем эмуляторе. После того как я удалю этот прокси-сервер, он вернется в нормальное состояние.

Бенсон
источник
1

ВАЖНО! В вашей среде может быть много виртуальных устройств. Убедитесь, что если вы меняете AVD, повторите настройку снова.

ОТЛАДКА ИНФОРМАЦИЯ-

В случае, если вы испытываете вышеуказанную ошибку, вы должны сначала проверить, что работает на порту 8081

Самый быстрый способ найти это, используя следующую команду в терминале

netstat -aon | findstr 8081

если это что-то показывает, значит порт заблокирован. если возможно, разблокируйте этот порт.

В противном случае вам нужно будет изменить порт. Процесс, который сделал это, уже упоминался в комментарии выше, Навин Кумар

react-native run-android --port=9001

Убедитесь, что 9001 тоже не используется :)

TARJU
источник
1

Попробуйте эти шаги, если вы попробовали все, что упомянуто в вышеупомянутых решениях:

  1. Создать файл в Android / App / SRC / Main / assets
  2. Запустите следующую команду:

Реактивный пакет --platform android --dev false - входной файл index.js --bundle-output android / app / src / main / assets / index.android.bundle --assets-dest android / app / src / основные / RES

  1. Теперь запустите вашу команду для сборки, например, реагируйте на родной запуск Android
Prayag
источник
Вау, это помогло мне частично. Я готовил свое приложение для Google Play Market, все, что я сделал, это добавил новые иконки активов для Android и изменил целевую версию на 28. Мне пришлось вернуться обратно на версию v27, и все снова начали работать ... Я не знаю, почему реагировать не работает с SDK v28.
Михаил Подгородецкий
0

Попробуйте следующее.

  1. Удалить папки Android и IOS
  2. запустить реагировать родной выброс
  3. запустить реагировать родной запустить андроид

Может быть, после предыдущих шагов у вас есть запуск npm start - --reset-cache

Я работаю, надеюсь, это поможет вам.

LuisO
источник
0

Если вы работаете в ОС Linux, возможно, ваш удаленный сервер npm не работает. Откройте другой терминал (с каталогом проекта) и запустите эту команду sudo npm start или sudo реагировать-нативный запуск перед выполнением sudo реагировать-нативный запуск-android

Вики Кешри
источник
0

Сообщение об ошибке на эмуляторе вводит в заблуждение. В моем случае я использовал Macbook. Мне нужно было изменить разрешения на Android / Gradlew при запуске $ chmod 755 ./gradlew, а затем приложение можно было собрать и развернуть в эмуляторе Android.

Джейн
источник