नमस्ते!

यदि आप रिएक्ट नेटिव के साथ काम कर रहे हैं, तो संभवतः आपको एमुलेटर समस्याओं का सामना करना पड़ा है। आप रिएक्ट नेटिव कमांड चलाते हैं, लेकिन एमुलेटर का पता नहीं चलता है। आपकी .zshrc, .bash_profile, या इसी तरह की फ़ाइलों में सभी आवश्यक पर्यावरण चर सेट करने के बाद भी, यह अभी भी काम नहीं करता है।

यहां कुछ सामान्य समस्याएं और समाधान दिए गए हैं:

1. एमुलेटर नहीं मिला: यदि एंड्रॉइड एसडीके पथ सही ढंग से सेट नहीं है तो ऐसा हो सकता है। दोबारा जांचें कि ANDROID_HOME और PATH पर्यावरण चर सही निर्देशिकाओं की ओर इशारा करते हैं। आप इन पंक्तियों को अपने .zshrc या .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
   

   ये परिवर्तन करने के बाद, अपने टर्मिनल को पुनरारंभ करें या स्रोत ~/.zshrc (या स्रोत ~/.bash_profile) चलाएं।

2. वॉचमैन त्रुटियां: कभी-कभी, वॉचमैन-फेसबुक की फ़ाइल देखने की सेवा-पुरानी फ़ाइल कैश के साथ समस्याएं पैदा कर सकती है। इसे ठीक करने के लिए, चलाएँ:
   

   watchman watch-del-all
   

   फिर, अपने रिएक्ट नेटिव सर्वर को पुनरारंभ करें।

3. एडीबी रिवर्स टू कनेक्ट टू लोकलहोस्ट: यदि आपका ऐप एंड्रॉइड एमुलेटर के भीतर लोकलहोस्ट से कनेक्ट नहीं हो सकता है, तो आपको चलाने की आवश्यकता हो सकती है:
   

   adb reverse tcp:8081 tcp:8081
   

   यह कमांड एमुलेटर से ट्रैफ़िक को आपकी स्थानीय मशीन तक रूट करता है। सुनिश्चित करें कि एडीबी आपके टर्मिनल से पहुंच योग्य है।

4. कैश साफ़ करें और पुनर्निर्माण करें: यदि आपको अभी भी समस्याओं का सामना करना पड़ता है, तो कैश साफ़ करने और प्रोजेक्ट को फिर से बनाने का प्रयास करें:
   

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

   फिर अपना रिएक्ट नेटिव ऐप दोबारा चलाएं।

5. रिएक्ट-नेटिव रन-एंड्रॉइड या रन-आईओएस का सीधे उपयोग करना: यदि एमुलेटर आपके आईडीई या टर्मिनल से सही ढंग से शुरू नहीं हो रहा है, तो ऐप को सीधे चलाने का प्रयास करें:
   

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

इन मुद्दों को डीबग करना निराशाजनक हो सकता है, लेकिन इन कदमों से मुझे कई सामान्य समस्याओं को हल करने में मदद मिली है।

मैंने एक उपयोग में आसान स्क्रिप्ट भी बनाई है

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",

    ...
  },

उपरोक्त स्क्रिप्ट का उपयोग करके, आप एमुलेटर और रिएक्ट नेटिव दोनों को एक साथ चला सकते हैं।

पढ़ने के लिए धन्यवाद!