找不到RNGestureHandlerModule

Question

我正在创建一个基本的 React-Native Expo 应用程序，并且我一直遇到一个问题。 我已经看到了有关同一主题的其他 Stack Overflow 问题，链接如下。我已经尝试了解决方案（如果有任何解决方案），但没有一个起作用。

不变违规：TurboModuleRegistry.getEnforcing（...）：找不到“RNGestureHandlerModule”

当我为我的应用程序进行开发构建并运行开发构建时，我收到以下两个错误：

错误1：

不变违规：TurboModuleRegistry.getEnforcing(...)：找不到“RNGestureHandlerModule”。 验证此名称的模块是否已在本机二进制文件中注册。Bridgeless 模式： false。 TurboModule 互操作： false。加载的模块：{“NativeModules”：[“PlatformConstants”，“LogBox”，“SourceCode”，“Timing”，“AppState”，“BlobModule”，“WebSocketModule”，“DevSettings”，“DevToolsSettingsManager”，“Networking”，“外观","DevLoadingView","HeadlessJsTaskSupport","DeviceInfo","UIManager","ImageLoader","SoundManager","IntentAndroid","DeviceEventManager","NativeAnimatedModule","I18nManager"],"TurboModules":[] ,"NotFound":["NativePerformanceCxx","NativePerformanceObserverCxx","RedBox","BugReporting","LinkingManager","NativeReactNativeFeatureFlagsCxx","RNCSafeAreaContext","RNGestureHandlerModule"]}，js引擎：hermes

错误2：

错误不变违规：“main”尚未注册。如果出现以下情况，就会发生这种情况：

• Metro（本地开发服务器）从错误的文件夹运行。检查Metro是否正在运行，在当前项目中停止并重新启动它。
• 模块由于错误而无法加载，并且

  AppRegistry.registerComponent

  未被调用。，js引擎：hermes

我必须指定该项目确实在本地工作。仅当我将其作为开发版本运行时才会失败。

对于我的代码，我有一个简单的导航设置，包含 App.js 文件、HomeScreen.js 和 ContactScreen.js。该应用程序是全新的，仅用于测试。

App.js：

import 'react-native-gesture-handler';
import React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import HomeScreen from './screens/HomeScreen';
import ContactScreen from './screens/ContactScreen';

const Stack = createStackNavigator();

export default function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName="Home">
        <Stack.Screen name="Home" component={HomeScreen} />
        <Stack.Screen name="Contact" component={ContactScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

HomeScreen.js：

import React from 'react';
import { View, Text, Button, StyleSheet } from 'react-native';

const HomeScreen = ({ navigation }) => {
  return (
    <View style={styles.container}>
      <Text style={styles.title}>Home Page</Text>
      <Button
        title="Go to Contact Page"
        onPress={() => navigation.navigate('Contact')}
      />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  title: {
    fontSize: 24,
    marginBottom: 20,
  },
});

export default HomeScreen;

ContactScreen.js：

import React from 'react';
import { View, Text, Button, StyleSheet } from 'react-native';

const ContactScreen = ({ navigation }) => {
  return (
    <View style={styles.container}>
      <Text style={styles.title}>Contact Page</Text>
      <Button
        title="Go to Home Page"
        onPress={() => navigation.navigate('Home')}
      />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  title: {
    fontSize: 24,
    marginBottom: 20,
  },
});

export default ContactScreen;

这是我的 Package.json 文件：

{
  "name": "yoyo",
  "version": "1.0.0",
  "main": "expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo run:android",
    "ios": "expo run:ios",
    "web": "expo start --web"
  },
  "dependencies": {
    "@react-navigation/native": "^6.1.18",
    "@react-navigation/stack": "^6.4.1",
    "expo": "^51.0.22",
    "expo-dev-client": "~4.0.20",
    "expo-status-bar": "~1.12.1",
    "react": "18.2.0",
    "react-native": "0.74.3",
    "react-native-document-picker": "^9.3.0",
    "react-native-gesture-handler": "~2.16.1",
    "react-native-safe-area-context": "4.10.5",
    "react-native-screens": "3.31.1",
    "react-navigation": "^5.0.0"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0"
  },
  "private": true
}

重现步骤：

npx create-expo-app yoyo --template blank
cd yoyo
yarn add expo
npx expo install expo-dev-client
npm install -g eas-cli
eas login
npx eas build:configure
npx eas build --profile development --platform android

Answer 1

我遇到了与您描述的完全相同的问题，经过多次试验，我发现在您的项目中安装这些软件包可以解决问题

"react-native-gesture-handler": "~2.16.1",
"react-native-safe-area-context": "4.10.5",
"react-native-reanimated": "~3.10.1",
"react-native-screens": "3.31.1"

确保它存在于您的 package.json 中并再次重建项目以查看结果