如何无需通过开发者菜单选择Remote JS Debugging启动React Native调试模式

太懂这个痛点了！之前我也碰到一模一样的问题——启动过程根本赶不上手动开调试，加上redux persist存了数据，重新加载后的状态完全不对。给你几个针对iOS非Expo项目的有效方案：

方案1：通过原生代码强制开启调试 #

在iOS项目的AppDelegate.m（或AppDelegate.mm）中，找到application:didFinishLaunchingWithOptions:方法，在初始化桥接前加入调试开关：

#import <React/RCTDebugger.h>

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  // 保留原有代码...
  
#ifdef DEBUG
  // 启动时自动开启远程JS调试
  RCTSetDebuggerEnabled(YES);
  // 可选：同时开启网络调试器
  RCTSetNetworkInspectorEnabled(YES);
#endif

  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge
                                                   moduleName:@"YourAppName"
                                            initialProperties:nil];
  // 保留原有代码...
  
  return YES;
}

这样App启动时会自动尝试连接调试器，无需手动进入开发者菜单操作。

方案2：通过环境变量启动调试 #

修改package.json的启动脚本，添加调试环境变量，让Metro启动时默认开启调试模式：

{
  "scripts": {
    "start:debug": "RCT_DEBUGGER_ENABLED=1 react-native start",
    "ios:debug": "react-native run-ios && npm run start:debug"
  }
}

之后用npm run ios:debug启动模拟器，App启动时就会自动连接调试器。

方案3：解决redux persist的状态干扰问题 #

既然调试时持久化数据会导致状态不一致，我们可以在开发模式下禁用持久化或清除旧数据：

import { persistStore, persistReducer } from 'redux-persist';
import AsyncStorage from '@react-native-async-storage/async-storage';

const persistConfig = {
  key: 'root',
  storage: AsyncStorage,
  // 开发模式下不持久化任何数据（也可指定特定reducer加入blacklist）
  ...(__DEV__ ? { blacklist: Object.keys(rootReducer) } : {})
};

const persistedReducer = persistReducer(persistConfig, rootReducer);

// 或者在App启动时手动清除持久化数据
if (__DEV__) {
  AsyncStorage.removeItem('persist:root')
    .then(() => console.log('调试模式下已清除持久化数据'))
    .catch(err => console.warn('清除持久化数据失败:', err));
}

这样每次调试启动时，App都会从初始状态开始，不会受之前持久化数据的影响。

所有方案仅在DEBUG模式下生效，正式打包时会自动忽略，不用担心影响生产环境。

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