如何分别查看Android和iOS平台的Metro bundler日志

方法1：多终端拆分启动（最推荐） #

直接用多个终端分别承载不同服务的日志，彻底避免混淆：

• 第一个终端只跑Metro Bundler：

  npx react-native start
  

• 第二个终端启动Android应用，日志单独输出在这里：

  npx react-native run-android
  

• 第三个终端启动iOS应用，日志单独输出在这里：

  npx react-native run-ios
  

这样Metro的打包日志、Android的运行日志、iOS的运行日志各占一个窗口，清晰明了。

方法2：用平台工具单独查看日志 #

如果不想开太多终端，可借助平台专属工具过滤或单独查看日志：

Android端 #

新开一个终端，用adb logcat精准过滤React Native相关日志：

adb logcat ReactNative:V ReactNativeJS:V *:S

这个命令只会输出RN框架和JS层的关键日志，和Metro的日志完全分开。

iOS端 #

直接用Xcode打开项目ios目录下的.xcworkspace文件，点击运行按钮启动模拟器，iOS的所有运行日志会单独显示在Xcode的控制台里，和Metro终端的日志互不干扰。

方法3：给日志加平台标记（代码改造） #

如果必须在同一个终端查看所有日志，可通过修改原生代码给日志加上平台前缀，方便区分：

Android端 #

修改android/app/src/main/java/com/[你的应用包名]/MainApplication.java，自定义日志输出逻辑，在每条日志前加上[Android]前缀。比如替换RN默认的日志实现，或者在初始化时配置自定义日志标签。

iOS端 #

修改ios/[你的应用名]/AppDelegate.m，重写NSLog方法添加前缀：

#import <Foundation/Foundation.h>

void NSLog(NSString *format, ...) {
    va_list args;
    va_start(args, format);
    NSString *logContent = [[NSString alloc] initWithFormat:format arguments:args];
    va_end(args);
    NSLog(@"[iOS] %@", logContent);
}

这样即使日志混在同一终端，也能通过前缀快速识别来源。

内容的提问来源于stack exchange，提问作者farhanJS