React-Native / Expo 项目上“无法连接到 Metro 服务器”

Question

我目前正在尝试使用 React-Native 和 Expo 用 MapView 组件构建一个小东西。

虽然当我在 Expo Go 中扫描 Expo QR 码时，Google 地图可以完美地显示在我的手机上，但我只是稍微修改了我的代码，只是修改了地图窗口的尺寸 - 这可能就是导致这种情况的原因，因为我这样做可能是错的，尽管我非常怀疑。

这是到目前为止我的代码（我只使用了 App.js 文件）：

import { StatusBar } from 'expo-status-bar';
import * as React from 'react';
import { StyleSheet, Text, View, Dimensions } from 'react-native';
import MapView from 'react-native-maps';
 
export default function App() {
  return (
    <View style={styles.container}>
      <MapView style={styles.map} />
    </View>
  );
}
 
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
  map: {
    width: Dimensions.get('window').width,
    height: Dimensions.get('window' - 10).height,
  },
});

我的终端中显示的错误是：

Cannot connect to the Metro server.

请尝试以下方法来解决该问题：

• 确保 Metro 服务器正在运行并且在同一网络上可用
• 确保您的设备/模拟器已连接到您的计算机并启用了 USB 调试 - 运行“adb devices”以查看已连接设备的列表
• 如果您使用连接到同一台计算机的物理设备，请运行“adb reverse tcp:8081 tcp:8081”以转发来自您设备的请求
• 如果您的设备位于同一 Wi-Fi 网络上，请将“开发设置”中的“设备的调试服务器主机和端口”设置为您计算机的 IP 地址和本地开发服务器的端口 - 例如 10.0.1.1:8081

网址：10.1.5.81:19000

Answer 1

在代码编辑器中运行此命令以删除警告

adb reverse tcp:8081 tcp:8081