React-native上加载图像时出错：意外字符

Question

我尝试在React-native上的组件上显示图像，但我不知道为什么会发生此错误...

代码示例：

render () {
    let { convenience } = this.props
    return (
      <View style={{flexDirection: 'row', height: 50}}>
        <Text style={{marginRight: 30}}>{convenience.name}</Text>
        <Image source={require('./icons___favorito_ativo.png')} />
      </View>
    )
}

PRINTSCREEN：

Answer 1

我也遇到了同样的错误。经过大量的尝试，我重新启动了打包器，应用程序选择了图像。因此解决方案是：重新启动打包器。

希望这有帮助。

Answer 2

目前React Native是一个未解决的问题：https://github.com/facebook/react-native/issues/6691。非常讨厌 - 目前，重新加载应用程序和/或重新启动软件包管理器是我目前唯一知道的解决方案。

Answer 3

在草图中导出的图像多次发生在我身上，这很奇怪。

我不知道为什么，但在从photoshop导出相同的图像后，错误消失了。

Answer 4

我的目录名中有空格。为了解决这个问题，我只使用了另一个目录。

更改

... \ Desktop \ develop（test）\ MyProject ...

到

... \桌面\开发\ MyProject的...

Answer 5

我知道这听起来很奇怪，但是如果有其他人到这里的话，我会添加这个评论。我创建了一个index.ios.js文件，方法是在https://rnplay.org处在线复制一个简单的例子。我不断得到“＃34;意想不到的字符＆＃34;错误。我使用Atom.io作为我的脚本工具。我想也许我的错误字符集有编码问题。我已经确认我使用的是UTF-8

所以我正在使用键盘上的（左/右）箭头键，我注意到光标将停止移动两个键盘箭头推动，就在我的模拟器红色灾难屏幕中识别的位置。就好像我的代码中有两个不可见的字符。我用这个玩了很长时间来证实。我能够突出显示＆＃34;隐藏＆＃34;字符并删除它们。

删除后，新代码效果很好。

怪异。不知道那里有什么。 （注意：我从https://rnplay.org/apps/5FsfPA复制了滑块示例代码，我使用＆＃34;全选＆＃34;和Command-C进行复制，使用Command-V粘贴......如果有人想要重复实验）

是的，我知道这听起来多么愚蠢。也许其他人也遇到过同样的问题？验证测试非常简单。从红屏错误消息标识的位置开始。使用键盘箭头并确认每次按键时文本上的光标都会移动。

Answer 6

我有类似的错误，但只是与android。 问题出在ios后缀：

文件名为back-icon@4x.ios.png

然后在代码中：

export const backButton = require('../../images/back-icon@4x.ios.png');

当我删除文件名和代码中的后缀（到'../../images/back-icon@4x.png'）时，错误消失了。

Answer 7

我遇到了同样的问题。对我有用的解决方案是删除＆＃34; _＆＃34;在图像的文件名上，最后热重新加载您的应用程序。