¡Hola!

Si ha estado trabajando con React Native, probablemente haya encontrado problemas con el emulador. Ejecuta el comando React Native, pero no se detecta el emulador. Incluso después de configurar todas las variables de entorno necesarias en sus archivos .zshrc, .bash_profile o similares, todavía no funciona.

A continuación se muestran algunos problemas y soluciones comunes:

1. Emulador no encontrado: Esto puede suceder si la ruta del SDK de Android no está configurada correctamente. Vuelva a verificar que las variables de entorno ANDROID_HOME y PATH apunten a los directorios correctos. Puede agregar estas líneas a su .zshrc o .bash_profile:
   

   export ANDROID_HOME=$HOME/Library/Android/sdk
   export PATH=$PATH:$ANDROID_HOME/emulator
   export PATH=$PATH:$ANDROID_HOME/tools
   export PATH=$PATH:$ANDROID_HOME/tools/bin
   export PATH=$PATH:$ANDROID_HOME/platform-tools
   

   Después de realizar estos cambios, reinicie su terminal o ejecute source ~/.zshrc (o source ~/.bash_profile).

2. Errores de Watchman: A veces, Watchman, el servicio de observación de archivos de Facebook, puede causar problemas con cachés de archivos obsoletos. Para solucionar este problema, ejecute:
   

   watchman watch-del-all
   

   Luego, reinicia tu servidor React Native.

3. adb revertir para conectarse a localhost: si su aplicación no puede conectarse a localhost desde el emulador de Android, es posible que deba ejecutar:
   

   adb reverse tcp:8081 tcp:8081
   

   Este comando dirige el tráfico desde el emulador a su máquina local. Asegúrese de que se pueda acceder a adb desde su terminal.

4. Borrar caché y reconstruir: si aún tienes problemas, intenta borrar el caché y reconstruir el proyecto:
   

   npm start -- --reset-cache
   cd android && ./gradlew clean
   cd ios && xcodebuild clean
   

   Luego ejecuta tu aplicación React Native nuevamente.

5. Uso de react-native run-android o run-ios directamente: si el emulador no se inicia correctamente desde tu IDE o terminal, intenta ejecutar la aplicación directamente con:
   

   npx react-native run-android
   npx react-native run-ios
   

Depurar estos problemas puede resultar frustrante, pero estos pasos me han ayudado a resolver muchos problemas comunes.

También creé un script fácil de usar

const {spawn, exec} = require('child_process');
const path = require('path');

// Define paths
const projectPath = path.resolve();

// Define commands
const watchDelCommand = `watchman watch-del '${projectPath}'`;
const watchProjectCommand = `watchman watch-project '${projectPath}'`;

// Function to execute commands
const clearWatchman = () => {
  // Execute watch-del command
  exec(watchDelCommand, (error, stdout, stderr) => {
    if (error) {
      console.error(`Error executing watch-del command: ${error.message}`);
      return;
    }
    if (stderr) {
      console.error(`stderr: ${stderr}`);
      return;
    }
    console.log(`watch-del command executed successfully: ${stdout}`);

    // Execute watch-project command
    exec(watchProjectCommand, (error, stdout, stderr) => {
      if (error) {
        console.error(
          `Error executing watch-project command: ${error.message}`,
        );
        return;
      }
      if (stderr) {
        console.error(`stderr: ${stderr}`);
        return;
      }
      console.log(`watch-project command executed successfully: ${stdout}`);
    });
  });
};

async function reverseAdb() {
  console.log('Running... adb reverse tcp:8080 tcp:8080');
  // After the emulator has started  adb reverse tcp:8080 tcp:8080
  const adbReverse = spawn('adb', ['reverse', 'tcp:8080', 'tcp:8080']);
  await new Promise((resolve, reject) => {
    let output = '';
    adbReverse.stdout.on('data', data => {
      output  = data.toString();
    });
    adbReverse.on('close', () => {
      resolve();
    });
    adbReverse.stderr.on('error', reject);
  }).catch(error => console.error('Error  reversing ADB port to 8080:', error));
}

async function runEmulator() {
  try {
    clearWatchman();
    // Check for running emulator
    const adbDevices = spawn('adb', ['devices']);
    const devices = await new Promise((resolve, reject) => {
      let output = '';
      adbDevices.stdout.on('data', data => {
        output  = data.toString();
      });
      adbDevices.on('close', () => {
        resolve(output.includes('emulator'));
      });
      adbDevices.stderr.on('error', reject);
    });

    if (devices) {
      console.log('Emulator is already running');
      reverseAdb();
      return;
    }

    // Get list of available emulators
    const emulatorList = spawn('emulator', ['-list-avds']);
    const emulatorName = await new Promise((resolve, reject) => {
      let output = '';
      emulatorList.stdout.on('data', data => {
        output  = data.toString();
      });
      emulatorList.on('close', () => {
        const lines = output.split('\n').filter(Boolean); // Filter out empty lines
        if (lines.length === 0) {
          reject(new Error('No AVDs found'));
        } else {
          resolve(lines[lines.length - 1]); // Get the last non-empty line
        }
      });
      emulatorList.stderr.on('error', reject);
    });

    // Start the emulator in detached mode
    const emulatorProcess = spawn('emulator', ['-avd', emulatorName], {
      detached: true,
      stdio: 'ignore',
    });

    emulatorProcess.unref(); // Allow the parent process to exit independently of the child

    reverseAdb();

    console.log(`Starting emulator: ${emulatorName}`);
  } catch (error) {
    console.error('Error running emulator:', error);
  }
}

runEmulator();


// package.json

  "scripts": {
    ...

    "dev:android": "yarn android:emulator && npx react-native@latest start",
    "android:emulator": "node runEmulator.js",

    ...
  },

Al usar el script anterior, puedes ejecutar el emulador y React Native simultáneamente.

¡Gracias por leer!