错误和警告

了解 Expo 项目中的 Redbox 错误和堆栈跟踪。


在使用 Expo 开发应用时,你会遇到 Redbox 错误或 Yellowbox 警告。这些日志体验是由 React Native 中的 LogBox 提供的。

🌐 When developing an application using Expo, you'll encounter a Redbox error or Yellowbox warning. These logging experiences are provided by LogBox in React Native.

红盒错误和黄盒警告

🌐 Redbox error and Yellowbox warning

当致命错误阻止你的应用运行时,会显示红框错误。显示黄框警告是为了提醒你可能存在问题,并且你在发布应用之前可能应该解决它。

🌐 A Redbox error is displayed when a fatal error prevents your app from running. A Yellowbox warning is displayed to inform you that there is a possible issue and you should probably resolve it before shipping your app.

你也可以使用 console.warn("Warning message")console.error("Error message") 自行创建警告和错误。触发红框的另一种方法是抛出错误而不捕获它:throw Error("Error message")

🌐 You can also create warnings and errors on your own with console.warn("Warning message") and console.error("Error message"). Another way to trigger the redbox is to throw an error and not catch it: throw Error("Error message").

这是使用 Expo CLI 调试 React Native 应用的简要介绍。有关详细信息,请参见 调试

堆栈跟踪

🌐 Stack traces

当你在开发过程中遇到错误时,你会看到错误信息和堆栈跟踪,堆栈跟踪是应用崩溃时最近调用的报告。这个堆栈跟踪会显示在你的终端和 Expo Go 应用中,或者如果你创建了开发构建,也会显示在那里。

🌐 When you encounter an error during development, you'll see the error message and a stack trace, which is a report of the recent calls your application made when it crashed. This stack trace is shown both in your terminal and the Expo Go app or if you have created a development build.

这个堆栈追踪非常有价值,因为它告诉你错误发生的位置。例如,在下面的图片中,错误来自文件 HomeScreen.js,并且是在该文件的第7行引发的。

🌐 This stack trace is extremely valuable since it gives you the location of the error's occurrence. For example, in the following image, the error comes from the file HomeScreen.js and is caused on line 7 in that file.

当你查看那个文件时,在第7行,你会看到一个名为 renderDescription 的变量被引用。错误信息说明找不到该变量,因为该变量并未在 HomeScreen.js 中声明。这是一个典型的例子,说明如果你花时间去解读错误信息和堆栈跟踪,它们可以多么有用。

🌐 When you look at that file, on line 7, you will see that a variable called renderDescription is referenced. The error message describes that the variable is not found because the variable is not declared in HomeScreen.js. This is a typical example of how helpful error messages and stack traces can be if you take the time to decipher them.

调试错误是开发中最令人沮丧但也最令人满足的部分之一。记住,你永远不是孤单的。Expo 社区以及 React 和 React Native 社区都是你遇到问题时寻求帮助的绝佳资源。很有可能其他人也遇到过你完全相同的错误。一定要阅读文档,搜索论坛GitHub issuesStack Overflow

🌐 Debugging errors is one of the most frustrating but satisfying parts of development. Remember that you're never alone. The Expo community and the React and React Native communities are great resources for help when you get stuck. There's a good chance someone else has run into your exact error. Make sure to read the documentation, search the forums, GitHub issues, and Stack Overflow.