Windowsのアセットindex.android.bundleからスクリプトを読み込めません

私のデバイス（Android 4.2.2）で初めて最初のReact Nativeプロジェクトを実行しようとしています。

そして私は得る：

アセットindex.android.bundleからスクリプトを読み込めません

私が使用したコマンド：

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

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毎回コマンドラインから実行するだけです。

物理デバイスでアプリケーションを実行していて、このエラーが発生する場合

unable to load script from assets index.android.bundle

コマンドを実行してみてください：

adb reverse tcp:8081 tcp:8081

それは私のために働いた...

私はこの問題を理解するために何時間も費やしました。私の問題は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を参照してください。

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に変更されました

私は実際のAndroidデバイスで同じ問題に直面しました。

解決策：Niltoidによるこの回答に基づく

1. ローカルIPを見つける
2. アプリを開いてAndroidデバイスをシェイクする
3. 開発設定に移動し、>サーバーをデバッグ...
4. IPとポートを貼り付けます。XXXX：8088 "（XはローカルIPです）

Macユーザーの場合：ネットワーク設定を開きます。ここでローカルIPを取得します。

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

公式ページに記載されている手順に従って、この問題を修正できます。JSバンドルは開発システムにあり、実際のデバイス内のアプリはその場所を認識していないため、この問題は実際のデバイスで発生します。

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。開発段階にいる人の役に立つことを願っています。

これと同じ問題が数か月間発生しました。最初は@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プロジェクトディレクトリに移動し、このフォルダが存在するかどうかを確認します android/app/src/main/assets

1. 存在する場合は、2つのファイルviz index.android.bundleとindex.android.bundle.meta
2. フォルダーアセットが存在しない場合は、そこにアセットディレクトリを作成します。

2.ルートプロジェクトディレクトリから

cd android && ./gradlew clean

3.最後に、ルートディレクトリに戻って、1つのエントリファイルが呼び出されているかどうかを確認します。index.js

• index.jsというファイルが1つしかない場合は、次のコマンドを実行します 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の2つのファイルがある場合、これを実行します 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

  4. 今すぐ実行 react-native run-android

OS：Windows

上記の2つの方法を試した後、この問題を解決する別の方法
（C：\ users \ "user_name" \ appdata \ local \ sdkのようなDEFAULT LOCATIONではない SDKをインストールしたため）

コマンドラインがアナウンスされていることに気付いた場合：「 'adb'は内部または外部コマンドとして認識されません...」

これが私が乗り越える方法です：
例：SDKをD：\ Android \ sdkにインストールした
ので、システム変数にパスを2行挿入します：

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

（パスのシステム変数を編集する方法がわからない場合は、ここにトピックがあります：https : //android.stackexchange.com/questions/38321/what-do-i-type-in​​-path-variable-for-adb- server-to-start-from-cmd / 38324）

次に、もう一度cmdを実行します。 react-native run-android

それは私のために働いた。

私の場合、MainApplication.javaから以下の行を削除しました。（これは以前、私が誤って追加したものです。）：-

import com.facebook.react.BuildConfig;

その後、プロジェクトをクリーンアップしてコマンドを押します

反応ネイティブ実行アンドロイド

以下のためのIOS：

ターミナルで：

cd ios

ビルドフォルダーを削除するには： rm -r build

再実行： react-native run-ios

または、Finderを開いてYOUR_PROJECT / iosに移動し、ビルドフォルダを削除することもでき ます。

次に、もう一度実行します。 react-native run-ios

以下のためのアンドロイド：

ターミナルで：

cd android/app

ビルドフォルダーを削除するには： rm -r build

再実行： react-native run-android

または、Finderを開いてYOUR_PROJECT / android / appに移動し、ビルドフォルダを削除することもでき ます。

次に、もう一度実行します。 react-native run-android

この問題については、次のコマンドを実行して解決します。

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

毎回。

エミュレーターでプロジェクトを実行すると正常に機能するが、実際のデバイスではこのエラーが発生するため、この問題にも直面していました。だから私は次の解決策でこの問題を解決します

最初のステップ：まず最初にcmdを開き、SDKマネージャーのPlatform-toolsフォルダーに移動します

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

2番目のステップ：次のコマンドを実行します。

adb devices

このコマンドの後、コマンドプロンプトにリストされているデバイスを確認します

3番目のステップ：これを実行します

adb reverse tcp:8081 tcp:8081

これでセットアップが完了しました

4番目のステップ：プロジェクトディレクトリに移動して、このコマンドを実行します

react-native run-android

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

5. ディレクトリでコマンド./studio.shを実行しandroid-studio/binます。Android Studioが開きます。

6. コマンドを実行しreact-native run-androidます。

物理的なデバイスとサーバーを同期するためにMetro Builderが実行されていることを確認してください

まず、このコマンドを実行してMetro Builderを実行します

npmスタート

次に、react nativeでビルドを開始できます

反応ネイティブ実行アンドロイド

今回はエラーになりません。変更時にコードをライブでリロードしたい場合。デバイスをシェイクして、[ライブ再読み込みを有効にする]をタップします

/ path / to / sdk / platform-toolsがパス変数に追加されていることを確認してください。

react-native run-androidを実行すると、adb reverse tcp：<device-port> tcp：<local-port>コマンドを実行して、デバイスからコンピューターのローカルで実行されているサーバーにリクエストを転送します。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 }

たとえば、プロジェクトのアプリケーション/バンドルIDの名前を変更したり、適切にリンクせずに外部パッケージを追加したりする場合など、React Nativeプロジェクトコードベースのリンクされていないアセットが原因である可能性があります。

プロジェクトのルートディレクトリで試してください。

react-native link

react-native run-android

react-native run-androidコマンドの実行時にトレースの2行目が

JS server not recognized, continuing with build...

つまり、アプリのパッケージャーを起動できず、追加の手順を実行しないとアプリの読み込みに失敗します。トレースの最後でも成功が報告されていることに注意してください。

BUILD SUCCESSFUL

問題はおそらくいくつかのポートの競合です（私の場合、それは私が完全に忘れていたデフォルトのIISサイトでした）。問題の別の兆候は、http://localhost:8081/debugger-uiChromeでURL を開けないことです。

ポートの競合が解決されると、トレースが報告します

Starting JS server...

次に、追加のノードウィンドウが開き（node ...cli.js start）、アプリが正常にロード/再ロードされます。

その後、Chromeでデバッグコンソールを開くことができるはず http://localhost:8081/debugger-uiです。

シミュレーターで実行しているときにも同じ問題が発生しました。通常の開発ワークフローを使用できるように、簡単な回避策を実行しました。

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";
  }
};

おそらく、プロダクションビルドを実行しようとすると、変更を元に戻す必要があります。

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：アプリのDev設定には何も変更しないでください。「localhost：8082」を追加した場合は、削除して空白のままにします。

編集：そこにいるすべてのMcAfee被害者にとって、ルートアクセスがあり、ポート8081にあるMcAfeeプロセスを一時的に停止するだけでポートを変更する必要がない場合は、より簡単な解決策があります。

sudo launchctl remove com.mcafee.agent.macmn

あなたは糸をインストールしていないと思いますチョコレートや何かでそれをインストールしてみてください。プロジェクトを作成する前にインストールする必要があります（react-native initコマンド）。

アセットディレクトリを作成する必要はありません。

動作しない場合は返信してください。

編集： 最近のバージョンのreact-nativeで修正されています。このアンインストールノードから完全に解放したい場合（完全なアンインストールについては、ノードを完全に削除するには、このリンクを参照してください）、ノードを再インストールし、react-native-cliを実行して新しいプロジェクトを作成します。

エミュレーターデバイスでインターネットをオンにすることを忘れないでください。このエラーを再解決しました。完璧に機能します。

これは一般的なエラーメッセージであり、ネイティブアプリケーションの開発中に反応した可能性があります。したがって、このチュートリアルでは、この問題の解決策を提供します。

問題の説明：Windowsのアセットindex.android.bundleからスクリプトを読み込めませんWindowsのアセットindex.android.bundleからスクリプトを読み込めません

上記の問題を解決するには、以下の手順に従ってください：

手順1：プロジェクトディレクトリ内に「assets」フォルダを作成するプロジェクトディレクトリ内に「MobileApp \ android \ app \ src \ main」というアセットフォルダを作成します。手動でアセットフォルダーを作成できます：

<または>

コマンドを使用してフォルダを作成することもできます。コマンド：mkdir android / app / src / main / assets

手順2：Reactネイティブアプリケーションの実行以下のコマンドを実行して、エミュレータまたは物理デバイスでreactネイティブアプリケーションを実行します。

プロジェクトディレクトリに切り替えます。cd MobileApp

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

最後のステップを実行して、エミュレーターまたは物理デバイスでネイティブアプリケーションを実行します。反応ネイティブ実行アンドロイド

<または>

また、最後の2つのコマンドを1つにまとめることもできます。この場合、コマンドを1回だけ実行する必要があります。

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

<または>

上記の手順は、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エミュレーターで新しいアプリが実行されるはずです。

これに従ってください、私のために働きました。

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

プロジェクトディレクトリに移動し、このフォルダーが存在するかどうかを確認しますandroid / app / src / main / assets i）存在する場合は、2つのファイルを削除しますviz index.android.bundleとindex.android.bundle.meta ii）フォルダーアセットが存在する場合存在しない場合は、そこにアセットディレクトリを作成します。

ルートプロジェクトディレクトリからcd android && ./gradlew cleanを実行します

最後に、ルートディレクトリに戻って、index.jsという単一のエントリファイルがあるかどうかを確認します。i）ファイルが1つしかない場合（つまり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

ii）index.android.jsとindex.ios.jsの2つのファイルがある場合は、この反応ネイティブバンドルを実行します--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を実行します

私はちょうど同じ問題に遭遇し、それを解決しました。参考になれば幸いです。

リリースアプリケーションパッケージ（.apk）をアセンブルするとします。

1. アセットフォルダーが存在するかどうかを確認しますか？：\ android \ app \ src \ main \ assets存在し ない場合は作成します。

2. 「Assembleリリース」を実行した後、そのフォルダー（\ 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 \ generated \ assets \ react \ release \ index.android.bundle *

より良い方法は、「すべて」を使用してファイル名を検索することです：index.android.bundle。

3. 次に、このファイルをアセットフォルダー（\ android \ app \ src \ main \ assets \ index.android.bundle）にコピーします

4. powershellまたはコマンドコンソールに戻り、次のコマンドを実行します。

react-native run-android --variant = release

うまくいくはずです。

幸運を！

反応ネイティブを0.49.5に更新すると、この問題が発生し、この重大な変更と非推奨にしたがった

消えた。

私はこの問題、多くの検索に直面しており、私はその問題を解決しました。

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

反応ネイティブを実行するより：

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

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 --assets-dest android / app / src / main / res

その後、すべてのターミナルを閉じ、android / app /からビルドフォルダーを消去して、アプリのビルドをクリーンに開始し、新しいターミナルを開き、

（プロジェクトディレクトリ内）npm run android

（別の端末で）パッケージャコンソールをプロンプトし、正常にビルドします