I'm trying to run my React Native app on Android using installDevDebug, and then starting Metro with:
npx react-native-start
Metro seems to bundle the app correctly (I can see in the console that the bundling is done), but when it finishes, the app stays on a white screen. If I don’t run Metro, the app works fine.

It rarely works sometimes though, but I can't seem to find what's different when it does. When it is working, if I refresh something that’s not a component, the app closes, and when I open it again, it comes back to the white screen after bundling as before.

If I try to pen the developer menu, it says:
No target connected

I also tried running:

npx react-native log-android

But it only outputs:

info starting logkitty

and nothing else.

I also tried reversing the port with:

adb reverse tcp:8081 tcp:8081
but it didn't solve the problem.

Has anyone experienced a similar issue where the app bundles successfully but cannot connect to Metro? How can I solve or debug this white screen and the "No target connected" issue?

Additional info:

• React Native: 0.83.1, newArch and hermes enabled

• Node 24.13.0 (Also tried Node 20.19.4)

And this is my metro.config.js:

const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');
const path = require('node:path');

/**
 * Metro configuration
 * https://reactnative.dev/docs/metro
 *
 * @type {import('@react-native/metro-config').MetroConfig}
 */
const defaultConfig = getDefaultConfig(__dirname);
const { assetExts, sourceExts } = defaultConfig.resolver;

const config = {
  transformer: {
    ...defaultConfig.transformer,
    babelTransformerPath: require.resolve('react-native-svg-transformer'),
  },
  resolver: {
    ...defaultConfig.resolver,
    assetExts: assetExts.filter(ext => ext !== 'svg'),
    sourceExts: [...sourceExts, 'svg'],
    extraNodeModules: {
      '@': path.resolve(__dirname, 'src'),
    },
  },
  watchFolders: [path.resolve(__dirname, 'src')],
};

module.exports = mergeConfig(defaultConfig, config);