如何用React Native可靠适配Windows、Web及Android平台？

核心问题分析 #

你的问题根源在于Expo 并未官方支持 React Native Windows，直接混用两者会导致Expo的核心运行时（globalThis.expo）无法在Windows环境初始化，同时Expo模块的原生代码也未针对Windows平台做链接适配。

分步修复方案 #

1. 调整项目依赖，剥离Expo专属组件 #

由于Expo不支持Windows平台，需移除Expo相关运行时依赖，改用纯React Native多平台组合：

# 卸载Expo核心依赖
npm uninstall expo @expo/metro-runtime babel-preset-expo
# 安装React Native官方Babel预设
npm install --save-dev @babel/preset-react-native

2. 更新Babel配置（babel.config.js） #

替换原Expo预设为React Native官方预设：

module.exports = {
  presets: ['@babel/preset-react-native'],
};

3. 调整Metro配置，适配多平台 #

修改metro.config.js，添加React Native Web支持并优化Windows平台解析规则：

const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');
const path = require('path');
const exclusionList = require('metro-config/src/defaults/exclusionList');

const rnwPath = path.resolve(require.resolve('react-native-windows/package.json'), '..');

const config = {
  resolver: {
    blockList: exclusionList([
      new RegExp(`${path.resolve(__dirname, 'windows').replace(/[/\\]/g, '/')}.*`),
      new RegExp(`${rnwPath}/build/.*`),
      new RegExp(`${rnwPath}/target/.*`),
      /.*\.ProjectImports\.zip/,
    ]),
    // 添加Web平台文件扩展名支持
    sourceExts: ['js', 'jsx', 'ts', 'tsx', 'web.js', 'web.ts', 'web.tsx'],
    // 映射React Native到Web版本
    alias: {
      'react-native$': 'react-native-web',
    },
  },
  transformer: {
    getTransformOptions: async () => ({
      transform: {
        experimentalImportSupport: false,
        inlineRequires: true,
      },
    }),
  },
  // 适配Web端路由入口
  server: {
    enhanceMiddleware: (middleware) => {
      return (req, res, next) => {
        if (req.url === '/') req.url = '/index.html';
        return middleware(req, res, next);
      };
    },
  },
};

module.exports = mergeConfig(getDefaultConfig(__dirname), config);

4. 重置Windows项目环境（若之前初始化存在残留问题） #

npx react-native clean-windows
npx react-native init-windows --overwrite

5. 各平台启动命令 #

• Windows: npx react-native run-windows
• Android: npx react-native run-android
• Web: npx react-native start --web

关键说明 #

• Expo官方仅支持iOS、Android、Web平台，不兼容Windows/macOS桌面端，直接混用Expo模板与React Native Windows必然引发运行时冲突。
• 若需保留Expo部分模块特性，可尝试通过expo-dev-client自定义开发客户端，但Windows平台仍需手动适配原生模块链接逻辑。

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