Bundler does not load automatically (No bundle URL present error)

Question

After updating my React Native app to the latest version up to date (0.60.4), launching my app using react-native run-ios would result in my application starting without a Metro Bundler.

The application would then display the following error:

In order for my application to function properly, I need to start the Metro Bundler using npm start and then run react-native run-ios.

Although this is a workaround, previously I did not have this issue and simply running react-native run-ios would start the Metro Bundler automatically. How can I resolve this?

EDIT: My NSAppTransportSecurity from Info.plist:

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
    <key>NSExceptionDomains</key>
    <dict>
        <key>localhost</key>
        <dict>
            <key>NSExceptionAllowsInsecureHTTPLoads</key>
            <true/>
        </dict>
    </dict>
</dict>

Answer 1

I guess this issue is common when upgrading existing projects to React Native v0.60.+.

For anyone encountering this issue on Mac:

1. Open Xcode and locate Build Phases under your project.
2. Tap on Editor -> Add Build Phase -> Add Run Script Build Phase.
3. Tap on the newly generated Run Script on the bottom of Build Phases tab.
4. Paste the following code:

export RCT_METRO_PORT="${RCT_METRO_PORT:=8081}"
echo "export RCT_METRO_PORT=${RCT_METRO_PORT}" > "${SRCROOT}/../node_modules/react-native/scripts/.packager.env"
if [ -z "${RCT_NO_LAUNCH_PACKAGER+xxx}" ] ; then
if nc -w 5 -z localhost ${RCT_METRO_PORT} ; then
if ! curl -s "http://localhost:${RCT_METRO_PORT}/status" | grep -q "packager-status:running" ; then
echo "Port ${RCT_METRO_PORT} already in use, packager is either not running or not running correctly"
exit 2
fi
else
open "$SRCROOT/../node_modules/react-native/scripts/launchPackager.command" || echo "Can't start packager automatically"
fi
fi

5. Launch your project through Xcode. Metro Bundler should now automatically start.
6. After saving your changes, the next time you run react-native run-ios in Terminal, Metro Bundler will automatically start and the No bundle URL present error will no longer persist.