如何离线运行Expo Dev Client并保留Metro调试功能？

方法一：预生成开发环境离线Bundle，保留调试能力 #

1. 生成开发模式的离线bundle与资源文件：

npx expo export --platform android --dev

该命令会在dist/目录下生成带调试符号的开发版JS bundle及配套资源。

2. 修改项目配置，让Dev Client启动优先加载本地离线bundle：
   在app.json或app.config.js中添加packagerOpts配置：

"packagerOpts": {
  "assetExts": ["*"],
  "sourceExts": ["js", "jsx", "ts", "tsx"],
  "offline": true,
  "dev": true
}

3. 重新构建并安装Dev Client到设备：

npx expo run:android --variant debug

安装完成后断开网络、开启飞行模式再启动App，即可加载本地开发bundle，同时保留Metro的调试能力（如React DevTools连接、控制台日志查看）。

方法二：配置Metro强制离线缓存，摆脱网络启动依赖 #

1. 在项目根目录创建metro.config.js，添加缓存配置：

const { getDefaultConfig } = require('expo/metro-config');

const config = getDefaultConfig(__dirname);

config.resolver.resolveRequest = (context, moduleName, platform) => {
  // 禁用远程缓存，强制使用本地缓存
  context.cacheStores = context.cacheStores.filter(store => store.name !== 'remote');
  return context.resolveRequest(context, moduleName, platform);
};

config.server.enableGlobalCache = true;
config.server.offlineMode = true;

module.exports = config;

2. 启动Metro并构建Dev Client：

expo start --dev-client --offline --dev

3. 先保持网络连接让Metro完成初始缓存，随后断开网络、开启飞行模式，重启App即可离线运行并保留调试功能。

方法三：Mock网络请求模拟离线场景 #

若无需完全断网，仅需测试App离线逻辑，可在开发环境中拦截网络请求：
在App入口文件添加全局拦截代码：

if (__DEV__) {
  const originalFetch = global.fetch;
  global.fetch = async (...args) => {
    return Promise.reject(new Error('Network request failed (offline mock)'));
  };
}

这种方式无需断网即可模拟离线状态，同时完整保留Metro调试能力。

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