在CodeSandbox中使用React Navigation遇ModuleNotFoundError问题求助

AI 小北

2026-8-3

问题背景

在CodeSandbox的React Native模板中引入@react-navigation/native-stack后，触发如下错误：

ModuleNotFoundError
Could not find module in path: 'react-native/Libraries/Utilities/Platform'
relative to '/node_modules/react-native/Libraries/StyleSheet/processColor.js'

已尝试重新安装依赖、重建沙箱，问题未解决。

问题原因

@react-navigation/native-stack是专门针对原生React Native（iOS/Android）开发的导航组件，依赖RN原生底层模块实现。而你当前的运行环境是React Native Web（通过react-native-web在浏览器端运行RN代码），原生模块的路径和实现与Web环境不兼容，导致找不到Platform模块。

解决方案

1. 替换为Web兼容的导航栈组件

改用纯JS实现的@react-navigation/stack，它完全支持React Native Web环境：

先确保在CodeSandbox依赖面板中添加了@react-navigation/stack
修改代码：

import React from "react"
import { Text } from "@react-native-material/core"

import { NavigationContainer } from "@react-navigation/native"
import { createStackNavigator } from "@react-navigation/stack" // 替换原native-stack导入

const Stack = createStackNavigator()

function App() {
  return <Text>Example text</Text>
}

export default App

2. 配置Web环境的模块解析（可选）

如果后续还有其他原生模块找不到的问题，可以添加webpack.config.js文件，配置别名让Web环境正确解析RN模块：

const path = require('path');

module.exports = {
  resolve: {
    alias: {
      'react-native$': 'react-native-web',
      'react-native/Libraries/Utilities/Platform': 'react-native-web/dist/exports/Platform',
    },
  },
};