Expo大作战--expo中的App Icon,expo中的Assets,expo中的ErrorHandling错误处理

Posted 2020-10-27

简要：本系列文章讲会对expo进行全面的介绍，本人从2017年6月份接触expo以来，对expo的研究断断续续，一路走来将近10个月，废话不多说，接下来你看到内容，讲全部来与官网

我猜去全部机翻+个人修改补充+demo测试的形式，对expo进行一次大补血！欢迎加入expo兴趣学习交流群：597732981

【之前我写过一些列关于expo和rn入门配置的东i西，大家可以点击这里查看：从零学习rn开发】

相关文章：

Expo大作战(一)--什么是expo，如何安装expo clinet和xde，xde如何使用

Expo大作战(二)--expo的生命周期，expo社区交流方式，expo学习必备资源，开发使用expo时关注的一些问题

Expo大作战(三)--针对已经开发过react native项目开发人员有针对性的介绍了expo，expo的局限性，开发时项目选型注意点等

Expo大作战(四)--快速用expo构建一个app，expo中的关键术语

Expo大作战(五)--expo中app.json 文件的配置信息

Expo大作战(六)--expo开发模式，expo中exp命令行工具，expo中如何查看日志log，expo中的调试方式

Expo大作战(七)--expo如何使用Genymotion模拟器

Expo大作战(八)--expo中的publish以及expo中的link，对link这块东西没有详细看，大家可以来和我交流

更多>>

接下来就开始撸码

---

指南

这些指南涵盖了您可能希望在Expo项目中实施的具体目标或功能。 例如，许多人希望加载除设备附带的字体外的自定义字体，或向用户发送推送通知。 阅读适合您需求的指南。

App图标

您的应用图标是用户在其设备的主屏幕以及App Store和Play商店中看到的图标。这是平台差异很重要的一个主题，并且要求可能很严格。本指南详细介绍了如何确保您的应用图标在所有设备上看起来尽可能好。

配置您的应用程序的图标

为您的应用程序提供图标最直接的方法是在app.json中提供图标键。如果你想尽可能做到最小，那么这个关键就足够了。但是，Expo还接受ios.icon和android.icon下的平台特定键。如果其中任何一个存在，他们将优先于各自平台上的基本图标键。大多数产品质量的应用程序可能会提供iOS和Android之间略有不同的东西。

图标最佳实践

iOS版
您用于iOS的图标应该遵循iOS图标的Apple人机界面指南。

• 使用一个PNG文件。
• 1024x1024是一个很好的尺寸。expo建设服务将为您生成其他尺寸。它生成的最大尺寸是1024x1024。
• 图标必须完全正方形，即1023x1024图标无效。
• 确保图标填充整个正方形，没有圆角或其他透明像素。适当时，操作系统将掩盖您的图标。

Android的
与iOS不同，操作系统不会将您的图标蒙上任何特定的形状。因此，您可能希望使用透明度来提供除正方形以外的其他形状。

• 使用一个PNG文件。
• 您可能仍然希望遵循Apple的一些最佳做法，以确保您的图标看起来很专业，例如在不同的壁纸上测试您的图标，并避免除产品的文字标记之外的文字。
• 提供至少512x512像素的东西。既然你已经在iOS上需要1024x1024，那么在这里也只是提供这个东西也不会有什么坏处。

expo客户和网络（Expo Client and Web）

如果您的应用程序包含隐私：在app.json中公开，它会显示在您的expo.io配置文件中。在这种情况下，我们会掩盖自己的图标以获得圆角，所以如果它在iOS上看起来合理，它在这里也可能看起来不错。

 

资产（Assets）

图像，字体，视频，声音，您的应用依赖的任何其他文件并不是javascript，而是被认为是一种资产。就像在网络上一样，资产也可以通过HTTP按需获取或流式传输。这与典型的移动应用程序不同，资产与应用程序二进制文件捆绑在一起。

然而，Expo在您使用的资源与需要的语法之间存在着区别，因为它们在本地文件系统上可用，例如：<Image source = {require（\'./ assets / images / example.png\' ）} />以及您通过网址引用的网页图片，例如：<Image source = {{uri：\'http://yourwebsite.com/logo.png\'}} />。由于我们不管理这些资产，因此我们无法保证您使用Web URI引用的图像的可用性。此外，我们没有关于任意Web URI的相同数量的信息：当您的资产在本地文件系统上可用时，打包程序能够读取一些元数据（例如宽度，高度）并将其传递到您的应用程序，所以你实际上不需要指定宽度和高度，例如。指定远程网址时，您需要明确指定宽度和高度，否则将默认为0x0。最后，正如您稍后将看到的，两种情况下的缓存行为都不相同。

以下是对前一类资产的解释：构建时您在文件系统中拥有的资产。在后一种情况下，假定您熟悉如何将图片上传到网页上的任何网页或移动应用程序可以访问的地方。

资产生活的地方 (Where assets live)

开发中(In development)

在处理项目的本地副本时，资源将从本地文件系统提供，并与JavaScript模块系统集成。所以如果我想包含一个图像，我可以require它，我们可以这样处理，如果它是JavaScript代码：require（\'./ assets / images / example.png\'）。这里唯一的区别是我们需要指定一个扩展名 - 没有扩展名，模块系统会认为它是一个JavaScript文件。此语句在编译时评估一个对象，该对象包含有关可由Image组件使用以获取并呈现它的资产的元数据：<Image source = {require（\'./ assets / images / example.png\'）} />

在生产中（In production）

每当您发布您的应用程序时，Expo都会将您的资产上传到Amazon CloudFront，这是一款速度非常快的CDN。它以智能的方式执行此操作，以确保您的部署保持快速：如果自上次部署以来资产没有发生变化，则会跳过它。你无需做任何事情就可以工作，它全部由expo自动处理。

性能(Performance)

某些资产太重要，无法启动您的应用程序(Some assets are too important to start your app without)。字体通常属于这个类别。在Web上，字体加载问题通过几种缩略语已知：FOUT，FOIT和FOFT，它们代表无风格文本的Flash，不可见文本的Flash和虚假文本的Flash（在此处阅读更多内容）。图标字体驱动的icon-font-powered@ expo / vector-icons图标的默认行为在第一次加载时为FOIT，在后续加载时，字体将被自动缓存。用户对移动设备的要求比网络更高，因此您可能希望通过在初始加载屏幕上预加载和缓存字体和重要图像来进一步推进。

错误处理

本指南详细介绍了一些可用于报告和从项目错误中恢复的策略。

处理致命的JS错误(Handling Fatal JS Errors)

如果您的应用程序遇到致命的JS错误，expo根据您的应用程序是否处于开发或生产状态而不同地报告错误。

在开发中：如果您从XDE或exp服务您的应用程序，致命的JS错误将报告给React Native RedBox，并且不会采取其他操作。

 

在生产中（In Production）：如果您发布的应用程序遇到致命的JS错误，Expo将立即重新加载您的应用程序。如果重新加载后错误发生得非常快，Expo会显示一个通用错误屏幕，并带有一个按钮来尝试手动重新加载。

 

Expo还可以在您重新加载应用程序后向您报告自定义信息。如果您使用ErrorRecovery.setRecoveryProps，并且应用程序稍后遇到致命的JS错误，那么在重新加载时，该方法调用的内容将被传回到您应用的初始道具中。参见Expo.ErrorRecovery。

 

跟踪JS错误

我们推荐使用Sentry来跟踪生产中的JS错误。

 

原生错误怎么样？(What about Native Errors)

由于expo的本地代码永远不会改变您的项目，所以本机符号(the native symbols)不是特别有意义的（它们会向您展示对React Native核心或expo本地SDK的追踪）。在绝大多数情况下*，JS错误才是是你关心的。

尽管如此，如果您真的想要本地崩溃日志并将您的应用部署为独立应用，则可以为Android配置自定义Fabric键。请参阅使用app.json进行配置。

对于iOS，我们现在不会公开一种方式让您从expo应用程序中看到原生崩溃日志。这是因为我们不会按需构建iOS本机代码，这将需要将调试符号上传到Fabric（或类似的服务）。

*在某些情况下，通过编写坏JS可能导致本机代码崩溃。通常，这些是在性能上不可接受的地方，例如为你的代码添加本地验证。 React Native桥梁的一部分，它将JS对象转换为类型化的本机值。如果遇到可解释的本机故障，请仔细检查您的参数类型是否正确。

---

下一张继续介绍，这一篇主要介绍了：expo中的App Icon,expo中的Assets,expo中的ErrorHandling错误处理,欢迎大家关注我的微信公众号，这篇文章是否被大家认可，我的衡量标准就是公

众号粉丝增长人数。欢迎大家转载，但必须保留本人博客链接！