无法从Windows上的资产index.android.bundle加载脚本


357

我正在尝试在我的设备(Android 4.2.2)上首次运行我的第一个React Native项目。

我得到:

无法从资产index.android.bundle加载脚本

我使用的命令:

  1. cd (project directory)
  2. react-native start
  3. react-native run-android

6
在尝试jerry的答案之前,请先检查您是否已在环境变量和路径平台工具中设置了ANDROID_HOME。
Sagar Chavada '18

这是最新版本中的错误。您必须通过使用react-native init ProjectName --version = 0.55.4使用以前的版本。此问题应已解决。
Sulung Nugroho '18

相同的错误,相同的上下文,但是修复很容易:等待调试服务器从更改为Loading dependency graph...Loading dependency graph, done然后在应用程序上重新加载。
Nino Filiu '18

公认的答案是一种极为不便的hack,使构建过程和代码库复杂化。这里有更好的答案。
安德鲁·科斯特

使用mkdir ... /assets && react-native bundle --platform..不能完全解决此问题,请检查以下内容:stackoverflow.com/a/55511803/10139109
Ian Zhong

Answers:


947

在遵循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每次都可以从命令行执行。


15
如果要修改文件index.android.js怎么办?每次在终端中,我们都必须插入命令react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
Maulik

9
Loading dependency graph...每当我从终端重新运行它时,它都会卡住,并且花费太多时间。仅供参考,我正在使用ubuntu 14.04
Maulik

12
React本机较新的版本不包含index.android.js,因此请在命令中使用App.js。:)谢谢
Chinthaka Dinadasa

11
@ChinthakaDinadasa以我为例index.js,不是App.js
Felix

11
这个家伙需要雕像!我的意思是,它确实不仅在Linux上而且在Windows 10上也有效
Reborn

126

如果您在物理设备上运行应用程序并出现此错误

unable to load script from assets index.android.bundle

尝试运行命令:

adb reverse tcp:8081 tcp:8081

它为我工作...


这解决了我的问题!谢谢!
Pablo

7
为我工作。对于那些在Windows的终端路径上没有android平台工具的人,adb可执行文件位于`C:\ Users \ YourUser \ AppData \ Local \ Android \ sdk \ platform-tools`
Mikepote,

2
我认为这应该是正确的答案,另一个似乎是hack。
克里斯蒂安·戈麦斯

2
这对我不起作用(在macOS上)
szx

这已为我解决了该问题(Windows,在物理设备上运行应用程序)。这是红色错误框上建议的修复程序之一。
Tur1ng

101

我花了几个小时试图弄清楚这个问题。我的问题并非特定于Windows,而是特定于Android。

访问开发服务器可以在本地和仿真器的浏览器中进行。唯一不起作用的是访问应用程序中的开发服务器。

从Android 9.0(API级别28)开始,默认情况下禁用明文支持。

AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest ...>
    <uses-permission android:name="android.permission.INTERNET" />
    <application
        ...
        android:usesCleartextTraffic="true"
        ...>
        ...
    </application>
</manifest>

看到更多信息:https : //stackoverflow.com/a/50834600/1713216


11
谢谢。升级targetSdkVersion到后,这是我的问题28
bencergazda

这是正确的答案。它实际上解决了网络通信问题。
安德鲁·科斯特

这是React Native v0.59.2中使用的解决方案。
Tur1ng

感谢您举报该问题-完全阻止了我的RN应用加载。令人失望的是,这里没有更好的错误消息传递:/
greg7gkb

2
作品!如果我亲自看到你,我会给你一枚奖章(-:
Yaron Levi

61

使用npm 4.3.0版本react-native-cli 2.01版本react-native 0.49.5版本

在项目目录中,

  • mkdir android/app/src/main/assets
  • 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

文件名已从index.android.js更改为index.js


3
Kinda感到遗憾的是,FB发布了一个新版本,而不是修复此错误(显然会打击很多人),而是破坏了公认的解决方法!
汤姆(Tom),

@IgorGanapolsky确保资产文件夹中有一个index.bundle文件
Darshan Pania,

@DarshanPania该文件做什么?
IgorGanapolsky

3
@IgorGanapolsky该JS文件是您应用程序的入口点。从RN 0.49开始,只有一个文件index.js代替index.android.jsindex.ios.js
Darshan Pania

1
对于Linux:sudo 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
Taohidul Islam

42

我在真正的android设备上也遇到过同样的问题。

解决方案:基于Niltoid的回答

  1. 查找您的本地IP
  2. 打开应用并摇动您的Android设备
  3. 进行开发设置并>调试服务器...
  4. 粘贴您的IP和端口;XXXX:8088“(其中X是您的本地IP)

对于Mac用户:打开您的网络偏好设置,在这里您将获得本地IP。


为我工作(y)
MAhipal Singh '18

22

如果您使用的是Windows,请按以下方式运行命令,或者收到错误消息“找不到入口文件index.android.js”。

  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


19

您可以按照官方页面上提到的说明解决此问题。由于JS捆绑包位于开发系统上,并且实际设备中的应用程序无法识别其位置,因此在实际设备上会发生此问题。


直接从android studio运行时出现此问题。使用react-native run-android固定它
yairsz

7
您的链接不再起作用,以后您应该参考关键的有用部分,以确保信息源消失后,信息仍然有效。
扎克·格里森

那么如何在真实设备上运行它呢?
IgorGanapolsky '18年

1
@IgorGanapolsky我有相同的问题,并通过官方文档进行了修复,您可以轻松地检查您的环境facebook.github.io/react-native/docs/running-on-device.html我无法从android studio加载porj android文件夹),但我可以使用项目和终端的根文件夹来执行此操作。
伊万·季特科夫

15

在Mac中有同样的问题,花了2天后,我终于能够正常工作了。

因为Emulator cellular data was turned off,我得到了unable to load script from assets index.android.bundle make sure your bundle is running

确保您Emulator cellular data is turned on通过执行此打包服务器能够捆绑index.android.js。希望它对处于开发阶段的人有所帮助。


你是什​​么Emulator cellular data is turned on?哪里是?虚拟设备?真实的设备?
格林

仿真器是指来自android studio的虚拟设备。
斯里尼瓦斯'18

13

我已经有相同的问题几个月了。我最初使用@Jerry的解决方案,但这是一个错误的解决方案,因为它不能完全解决问题。相反,它所做的就是将每个构建都视为生产构建,这意味着您对应用程序进行的任何细微更改都意味着必须重新构建整个应用程序。

虽然这是一个临时解决方案,但由于您不再能够使用React Native令人惊叹的开发工具(例如热重载等),因此从长远来看,它是可怕的。

正确的解决方案如下所示:

在您的MainApplication.java文件中,替换以下内容:

@Override
public boolean getUseDeveloperSupport() {
    return BuildConfig.DEBUG;
}

@Override
public boolean getUseDeveloperSupport() {
    return true;
}

由于某种原因,BuildConfig.DEBUG总是返回false并导致资产目录中出现捆绑文件。

通过手动将其设置为true,您将强制应用程序使用打包程序。此功能无法在生产环境中使用,因此请务必将其更改为false或默认值。

别忘了也要跑步

$ adb reverse tcp:8081 tcp:8081

1
这是真正的解决方案。谢谢!
keyserfaty

1
天哪,这是实际的解决方案。接受的答案不适用于热重装,绝不是对该问题的合法解决方案。
Ganesh Datta

11

1进入项目目录并检查该文件夹是否存在 android/app/src/main/assets

  1. 如果存在,那么删除这两个文件即index.android.bundleindex.android.bundle.meta
  2. 如果文件夹资产不存在,则在其中创建资产目录。

2.从您的根项目目录执行

cd android && ./gradlew clean

3.最后,导航回到根目录并检查是否存在一个名为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

  • 如果有两个文件,即index.android.js和index.ios.js,则运行此文件 react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

    1. 现在运行 react-native run-android

在尝试了几乎所有这些情况之后……这是唯一对我有用的解决方案。谢谢!!!!
MizAkita

在Ubuntu 18.04入门指南中遇到此错误后,这对我有用。谢谢!
10/30

在Mac os Catalina中,这对我有用,谢谢
Hitesh

9

操作系统:Windows

在尝试了上述两种方法之后,另一种解决此问题的方法
(因为我未在默认位置安装SDK ,例如C:\ users \“ user_name” \ appdata \ local \ sdk

如果您注意到命令行宣布:“'adb'不被识别为内部或外部命令...”

所以这就是我的解决方法:
示例:我在D:\ Android \ sdk中安装了SDK,
因此我将在System Variables中插入路径多两行:

D:\Android\sdk\tools  
D:\Android\sdk\platform-tools  

(如果您不知道如何编辑路径系统变量,则为以下主题:https : //android.stackexchange.com/questions/38321/what-do-i-type-in​​-path-variable-for-adb-服务器从cmd / 38324启动

然后我再次运行cmd: react-native run-android

它为我工作。


即使它没有真正连接-这是非常常见的问题之一,并且正如Thien所述
像素像素技术专家(Pixelartist)

8

就我而言,我从MainApplication.java中删除了下面的行。(以前我是错误地添加的。):-

导入com.facebook.react.BuildConfig;

在清理项目并点击命令后

react-native运行Android


谢谢,它也对我有帮助。
阿尼尔·拉夫萨希布

6

对于IOS:

在终端中:

cd ios

使用以下方法删除构建文件夹: rm -r build

再次运行: react-native run-ios

或者,你可以打开Finder中依次YOUR_PROJECT / IOS删除构建 文件夹

然后再次运行: react-native run-ios

对于ANDROID:

在终端中:

cd android/app

使用以下方法删除构建文件夹: rm -r build

再次运行: react-native run-android

或者,你可以打开Finder中依次YOUR_PROJECT /安卓/应用程序,并删除建立 文件夹

然后再次运行: react-native run-android


2
适用于Android!干净又容易!
llioor18年

android/app/bin在Windows上删除文件夹也可以。我直接从Android Studio构建了该项目,而不是运行react-native run-android,看来它构建了一些错误,必须手动删除。
卢卡斯·布斯塔曼特

5

对于这个问题,我只需要运行以下命令即可解决:

react-native start

然后

adb reverse tcp:8081 tcp:8081

在命令行上。然后我可以运行:

react-native run-android

因此,我不会浪费时间运行:

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

每次。


5

我也面临这个问题,因为当我在模拟器上运行项目时,它可以正常工作,但在真实设备上会出现此错误。所以我通过以下解决方案解决了这个问题

第一步:首先打开cmd并转到SDK管理器Platform-tools文件夹

cd C:Development\Android\Sdk\Platform-tools

第二步:现在运行以下命令:

adb devices

执行此命令后,检查命令提示符中列出的设备

第三步:现在运行

adb reverse tcp:8081 tcp:8081

现在您的设置完成

第四步:转到您的项目目录并运行此命令

react-native run-android

4

的Ubuntu

第一次,我使用创建了新应用react-native init project-name。我遇到了同样的错误。所以我按照以下步骤解决此问题。

  1. 首先sudo chown user-name-of-pc /dev/kvm以我的情况运行。
  2. 从Android手机调试时,选择Use USB to Transfer photos (PTP)

  3. 创建文件夹 assets在项目名称/ android / app / src / main中

  4. 确保index.js在您的项目root 目录中可用,然后在cd project-name目录后从控制台运行以下命令。

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

或index.android.js然后

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

  1. ./studio.shandroid-studio/bin目录中运行命令。它将打开Android Studio。

  2. 运行命令react-native run-android

在此处输入图片说明


4

确保Metro Builder正在运行,以使您的物理设备和服务器同步

首先,运行此命令以运行Metro Builder

npm开始

然后您可以开始在本机构建

react-native运行Android

他们这次应该没有错误。如果您希望代码保持实时状态,请在更改时重新加载。摇动设备,然后点击启用实时重新加载


3

确保已将/ path / to / sdk / platform-tools添加到path变量。

当您运行react-native run-android时,它将运行adb reverse tcp:<设备端口> tcp:<本地端口>命令,将请求从设备转发到计算机上本地运行的服务器。如果找不到adb,您将看到类似这样的内容。

/bin/sh: 1: adb: not found
Starting the app (.../platform-tools/adb shell am start -n 
com.first_app/com.first_app.MainActivity...
Starting: Intent { cmp=com.first_app/.MainActivity }

这应该是最受好评的答案,因为它应该是首先要检查的内容之一
eis

3

例如,这可能是由于您的React Native项目代码库中的未链接资产引起的,例如,当您重命名项目应用程序/捆绑ID或添加未正确链接它的外部包时。

只需在您的项目根目录中尝试:

react-native link

react-native run-android

2

如果在运行react-native run-android命令时跟踪的第二行是

JS server not recognized, continuing with build...

这意味着该应用的打包程序无法启动,并且如果没有一些额外的步骤,该应用将无法加载。请注意,跟踪结束仍报告成功:

BUILD SUCCESSFUL

问题可能是端口冲突(在我的情况下,这是我完全忘记的默认IIS站点)。问题的另一种表现是无法打开http://localhost:8081/debugger-ui在Chrome中 URL。

解决端口冲突后,将报告跟踪

Starting JS server...

然后另一个Node窗口将打开(node ...cli.js start),应用将成功加载/重新加载。

之后,您应该可以使用来在Chrome中打开调试控制台 http://localhost:8081/debugger-ui


2

即使在模拟器上运行,我也遇到同样的问题。我做了一个快速的解决方法,以便可以使用正常的开发工作流程。

private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
  @Override
  public boolean getUseDeveloperSupport() {
    // return true here to load JS from the packager
    // BuildConfig.DEBUG for me was set to false which meant it
    // it was always trying to load the assets from assets folder.
    return true;
  }

  @Override
  protected String getJSMainModuleName() {
    return "index";
  }
};

尝试进行生产构建时,可能必须还原更改。


2

我在Mac阻止端口8081上的McAfee出现问题,必须将其更改为8082。

首先运行您的软件包服务器:

react-native start --port 8082

打开另一个终端,照常启动android应用程序:

react-native run-android

完成后,现在重写adb隧道的tcp端口:

adb reverse tcp:8081 tcp:8082

请参阅adb tcp隧道列表:

adb reverse --list

现在,您应该会看到一个令人振奋的消息:

(reverse) tcp:8081 tcp:8082

转到您的应用并重新加载,完成!

PS:不要在应用程序开发设置中进行任何更改,如果您添加了“ localhost:8082”,则将其删除,将其留空。

编辑:对于所有在那里的McAfee受害者,如果您具有root用户访问权限,那么有一个更简单的解决方案,只需暂时终止位于端口8081上的McAfee进程,而根本不需要更改端口即可:

sudo launchctl remove com.mcafee.agent.macmn

2

我想你没有毛线尝试将其与巧克力味或类似物质一起安装。应该在创建项目之前安装它(react-native init命令)。

无需创建资产目录。

如果不起作用,请回复。

编辑: 在最新版本的react-native中,他们已对其进行了修复。如果您想从中获得完全的自由,只需卸载节点(有关完全卸载,请完全删除节点,请参考此链接)并重新安装节点,然后react-native-cli然后创建新项目。


2

别忘了在模拟器设备中打开Internet,我重新解决了该错误,它可以完美运行:V我收到此错误,因为我关闭了Internet以测试NetInfo:D


2

这是一般错误消息,您在React Native应用程序开发过程中可能会遇到。因此,在本教程中,我们将提供针对此问题的解决方案。

问题说明:无法在Windows上从资产index.android.bundle加载脚本无法在Windows上从资产index.android.bundle加载脚本

请按照以下步骤解决以上问题:

步骤1:在项目目录中创建“资产”文件夹现在,在项目目录“ MobileApp \ android \ app \ src \ main”中创建资产文件夹。您可以手动创建资产文件夹:

<或>

您也可以使用命令创建文件夹。命令:mkdir android / app / src / main / assets

步骤2:运行您的React Native应用程序让我们运行以下命令在模拟器或物理设备中运行React Native应用程序。

切换到项目目录。cd MobileApp

运行以下命令,以帮助您捆绑android应用程序项目。

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

运行最后一步,以在模拟器或物理设备中运行本机应用程序。react-native运行Android

<或>

您也可以将最后两个命令合二为一,在这种情况下,您只需执行一次命令。

react-native包--platform android --dev否--entry-file index.js --bundle-output android / app / src / main / assets / index.android.bundle --assest-dest android / app / src / main / res && react-native运行Android

<或>

您可以通过将它们放在package.json的脚本部分中来自动执行上述步骤,如下所示:

“ android-android”:“ 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“

如果一切设置正确,您很快就会在Android模拟器中看到新应用正在运行。


2

遵循此,为我工作。

https://github.com/react-community/lottie-react-native/issues/269

转到项目目录并检查此文件夹是否存在android / app / src / main / assets i)如果存在,则删除两个文件,即index.android.bundle和index.android.bundle.meta ii)如果文件夹资产不存在不存在,然后在此处创建资产目录。

从根项目目录中执行cd android && ./gradlew clean

最后,导航回到根目录并检查是否有一个名为index.js的单个条目文件。i)如果只有一个文件(即index.js),请运行以下命令react-native bundle --platform android --dev false- -entry-file index.js --bundle-输出android / app / src / main / assets / index.android.bundle --assest-dest android / app / src / main / res

ii)如果有两个文件,即index.android.js和index.ios.js,则运行此react-native包--platform android --dev false --entry-file index.android.js --bundle-output android /app/src/main/assets/index.android.bundle --assets-dest android / app / src / main / res

现在运行react-native run-android


您的评论极大地帮助了我。我不确定为什么需要删除两个捆绑文件。但是您的指示会完美!非常感谢!
VK1

2

我刚刚遇到了完全相同的问题并解决了。因此希望对您有所帮助。

假设您正在组装发布应用程序包(.apk)

  1. 检查资产文件夹是否存在?:\ android \ app \ src \ main \ assets 如果不存在,请创建一个。

  2. 执行“ Assemble Release”后,检查该文件夹中是否有任何内容(\ android \ app \ src \ main \ assets),如果没有,请找到js捆绑文件(index.android.bundle),该文件应位于以下多个文件中以下路径:

    * a)\ android \ app \ build \ intermediates \ merged_assets \ release \ out \ index.android.bundle

    b)\ android \ app \ build \ intermediates \ merged_assets \ release \ mergeReleaseAssets \ out \ index.android.bundle

    c)\ android \ app \ build \ intermediates \ assets \ release \ index.android.bundle

    d)\ android \ app \ build \ generate \ assets \ react \ release \ index.android.bundle *

更好的方法是使用“所有内容”搜索文件名:index.android.bundle。

  1. 然后将此文件复制到您的资产文件夹(\ android \ app \ src \ main \ assets \ index.android.bundle)

  2. 返回PowerShell或命令控制台,执行:

react-native运行android --variant = release

它应该工作。

祝好运!


非常感谢你!奋斗了三天!顺便说一句本机0.59解决了该问题。
安妮


1

图片

我正面临这个问题,经过大量搜索,我解决了这个问题。

c:\ProjectFolder\ProjectName> 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:

c:\ProjectFolder\ProjectName>react-native run-android


1
屏幕截图与答案无关。
泰勒(Tyler)

1

对于所有使用create-react-native-app开发并退出并在中遇到此问题的人development,这对我来说都是有用的,只是接受的答案有一点点细节

(在项目目录中)mkdir android / app / src / main / assets

这是改变您正在开发中的cos的--dev: false部分:

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

之后,关闭所有终端,从android / app /中删除build文件夹,以确保您开始清理即可构建应用,打开新终端,然后

(在项目目录中)npm运行android

将提示打包程序控制台(在另一个终端中)并成功构建

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.