无法加载 exp:// 出错了

Could not load exp:// Something went wrong

我使用 Expo XDE 创建了一个项目。当我扫描这个 QR 码时我检查了这个 Can't load expo app: Something went wrong but I have already enabled "Draw over other apps". It works https://expo.io/@ajaysaini/first-proj 但当我 运行 它在来自 XDE 的 android 设备上时它没有。

main.js

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

class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <Text>Updating!</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

Expo.registerRootComponent(App);

当我 运行 在设备上安装它时,它在 android 设备上显示以下错误。我多次尝试在 XDE 中重新启动,但没有帮助。

Dependency graph loaded.
11:19:21 AM
Starting React Native packager...
11:19:24 AM
Scanning 528 folders for symlinks in D:\Expo\first-proj\first-proj\node_modules (18ms)
11:19:24 AM
Loading dependency graph.
11:19:24 AM
Running packager on port 19001.
11:19:25 AM
11:19:33 AM
Project opened! You can now use the "Share" or "Device" buttons to view your project.
11:19:44 AM
Opening on Android device
11:19:54 AM
Dependency graph loaded.
11:21:41 AM
Opening on Android device
11:23:31 AM
Opening on Android device

错误:

There was an unhandled error: Could not load exp://
Stack Trace:

谁能帮我看看哪里出了问题?

你最好打开XDE Client,开启开发模式。然后,点击 gray cog 使 Host > LAN(局域网 - 这意味着通过 WiFi 与真实设备共享包)。

Localhost 选项也可以,但根据 Expo Debugging docs:

If you are using LAN, make sure your device is on the same wifi network as your development machine. This may not work on some public networks. localhost will not work for iOS unless you are in the simulator, and it only works on Android if your device is connected to your machine via USB.

此外,这是我几个月前写的一个直观的信息性答案,可能也有帮助:

我通过 React Native 团队的推荐解决了同样的问题 - 安装和 运行 Genymotion 软件::

  1. 使用 VirtualBox 安装 Genymotion
  2. 在 Genymotion 网站注册
  3. 运行 Genymotion 软件和 !!!SignIn
  4. 关闭带项目的npm提示程序,重新启动
  5. npm start(在项目目录下的npm promtwindow)
  6. 关闭并启动 Expo 应用程序,扫描条形码

如果我的应用程序 运行 成功 IpV 地址相同,例如:

exp://10.0.0.125:19000   and
ipconfig -> IPv4 Address. . . . . . . . . . . : 10.0.0.125

如果有人遇到类似问题,我的问题是要求允许 node.js 连接到网络出现,并且有效。

出于某种原因,我与 docker 产生了冲突,我禁用了它并且它没有问题地工作,我几乎可以肯定它是 hyper-V

也许这可能有助于简单地解释一下,如果您的 phone 和您的计算机在不同的网络上,就会发生这样的错误。

我通过网络共享解决了这个问题,我的两台设备不在同一个网络上。

这意味着您可能可以将您的两个设备连接到它应该工作的同一个 WiFi。

可能是您的网络不支持局域网通信。将 LAN 切换到本地对我有用。 From your MAC you can go to http://localhost:[portnumber] 如下图所示。

有时问题是由于使用了错误的网络适配器优先级。

打开终端并运行

ipconfig

如果您的主 LAN 适配器未列为第一个适配器,则更改适配器优先级可能会解决问题。只需按照以下步骤操作:

  1. 转到控制面板 > 网络和 Internet > 网络连接

  2. 右键单击您的主局域网

  3. 单击“属性”>“Internet 协议版本 4”

  4. 单击“属性”>“高级”

  5. 取消选中 'Automatic Metric'

  6. 在'Interface Metric'

  7. 中输入10
  8. 单击确定

假设:通过 NPM/Yarn 在计算机上安装了 Expo (https://expo.io),并在 Android/iPhone 上安装了 Expo。 此外,Phone 与计算机在同一个 wifi 网络上。

我的电脑是通过 WiFI 连接的,这就是我的问题。 Windows:命令行:$ipconfig 查找计算机的 Wifi IP 地址。我的是 Ip v4 : 192.168.1.xxx 在 Phones 网络浏览器 URL 上输入 web 浏览器:exp://192.168.1.xxx:19000 然后应该会看到一些文本,这意味着 phone 正在通过网络连接(好兆头) 然后在 Phone 上打开 expo,应该可以通过剪贴板看到 link。 通过 剪贴板 单击 Link,它位于 phone 上的 Expo 程序内。 然后它应该在您的 phone 上加载应用程序。 这对我有用。 P.s 首次运行时请按照说明授予 Expo 许可等。

我遇到了同样的问题,none 的解决方案对我有用。这里的问题是 Expo 显示了您的 phone 无法连接到的错误 IP 地址。

这就是我解决它的方法。我假设您在 windows 上并使用 LAN 运行 您设备上的应用程序。

  1. 打开cmd,输入ipconfig,找出你的本地IP。它应该是 在 Wireless LAN Adapter 部分下列为 IPv4 Address。它 看起来像 192.168.xx.x
  2. 现在在 phone 中打开任何文本编辑器并输入 exp://192.168.xx.x:19000。将此文本复制到剪贴板。
  3. 打开 Expo 应用程序。您现在将看到 Open from Clipboard 选项 顶端。按下它,您的应用就会加载。

现在任何时候你想加载一个应用程序,你可以复制相同的地址并在 Expo 中打开它。

There's another simpler workaround I found. Run the command set REACT_NATIVE_PACKAGER_HOSTNAME=192.168.xx.x before expo start. This will set the correct IP in Expo Dev Tools.

希望对您有所帮助。

我通过更新 npm 和节点解决了我的问题..

我想很多人肯定已经完成了上述所有操作,但仍然有 出现错误错误

文档可能指定了在本地构建并且您的设备已连接到您的机器时,您应该单击 Web 调试页面上显示 QR 码图像的本地部分。

然后在点击“本地”后,尝试再次扫描二维码,您的错误应该会消失,并显示正在加载绑定的 javascripts 资产。

在我的情况下是 VPN - 我的手机在断开连接后连接到 VPN 成功加载!

如果你们使用防火墙,请确保将端口 19000 和 19001 列入白名单。

确保您的笔记本电脑和 android 设备连接到同一个网络,这应该可以解决问题,就像我刚刚做的那样。

在“开始”菜单上,单击 运行,键入 WF.msc,然后单击“确定”。

在 Windows 高级安全防火墙的左窗格中,右键单击入站规则,然后在操作窗格中单击 新建规则

在规则类型对话框中,select端口,然后单击下一步。

在“协议和端口”对话框中,select TCP。 Select 所有本地端口,单击下一步。

在“操作”对话框中,select允许连接,然后单击“下一步”。

在“配置文件”对话框中,select 任何描述计算机连接的配置文件 环境,然后单击下一步。

在“名称”对话框中,键入此规则的名称和说明,然后单击“完成”。

我建议删除 运行 Yarn 之前的 .expo 文件夹 :)

我尝试了此处给出的建议,但不适合我的问题。 这对我有用。转到 localhost:19002 为 运行 的浏览器,并将连接更改为 Tunnel。扫描从您的手机生成的新二维码。 希望这对您有所帮助!

将我的家庭网络从 'public' 更改为 'private' 对我有用。 打开您的网络连接 -> 右键单击​​您的家庭网络连接 -> 属性 -> 将“网络配置文件”从 'public' 更改为 'private'

检查您是否 运行 将电脑或手机上的 VPN 关闭然后重新启动。对我来说,这解决了我的问题。

我使用隧道而不是 lan 或本地,它工作正常并在我扫描代码后开始构建应用程序。