如何在React Native中执行日志logging？

如何在React Native中logging一个variables，例如在为web开发时使用console.log ？

Answer 1

console.log工作。

默认情况下，在iOS上，它会logging到Xcode中的debugging窗格。

从IOS模拟器按（ ⌘ + D ）并按远程JSdebugging 。 这将在localhost上打开一个资源http：// localhost：8081 / debugger-ui 。 从那里使用Chrome开发人员工具的JavaScript控制台来查看console.log

Answer 2

使用console.log ， console.warn等

截至React Native 0.29，您只需运行以下命令即可在控制台中查看日志：

 $ react-native log-ios $ react-native log-android 

Answer 3

Android的

在Android上，这很简单，只需在terminal中input以下内容即可：

 adb logcat | grep ReactNativeJS 

---

iOS版

您不需要运行Xcode，也不需要使用Chromedebugging器。

如果您使用的是Nuclide IDE，这就是所有使用React本机的Facebook工程师所使用的：

按CMD + Shift + P键入“logs”：

您将在“控制台”选项卡中看到输出：

Answer 4

Pre React Native 0.29，在控制台中运行：

adb logcat *:S ReactNative:V ReactNativeJS:V

Post React Native 0.29，运行：

react-native log-ios

要么

react-native log-android

正如马丁在另一个答案中所说。

这显示所有console.log（），错误，笔记等，并导致零速度减慢。

Answer 5

Visual Studio Code有一个体面的debugging控制台，可以显示您的console.log。

VS Code通常是React Native友好的。

Answer 6

使用console.debug("text");

你会看到terminal内的日志。

脚步：

• 运行应用程序：

   $ react-native run-ios (For iOS) $ react-native run-android (For Android) 

• 运行logging器：

   $ react-native log-ios (For iOS) $ react-native log-android (For Android) 

Answer 7

我有同样的问题：控制台消息不出现在XCode的debugging区域。 在我的应用程序中，我做了CMD-D调出debugging菜单，并记得我已经设置“在Safari中debugging”。

我把它closures， 一些消息被打印到输出消息，但不是我的控制台消息。 不过，有一条日志消息说：

 __DEV__ === false, development-level warning are OFF, performance optimizations are ON" 

这是因为我之前已经使用以下命令将我的项目捆绑在真实设备上进行testing：

 react-native bundle --minify 

这捆绑没有“开发模式”上。 要允许开发消息，请包括–dev标志：

 react-native bundle --dev 

而console.log消息又回来了！ 如果你没有绑定一个真实的设备，不要忘记把AppDelegate.m jsCodeLocation重新指向localhost（我做的！）。

Answer 8

在Xcode Simulator中按[command + control + Z]，selectDebug JS Remotely，然后按[command + option + J]打开Chrome开发者工具。

Xcode模拟器图

请参阅： debuggingReact Native应用程序

Answer 9

一个月前刚刚推出的是“创buildReact原生应用程序”，一个令人敬畏的样板，可以让你（用最less的努力）展示你的应用程序看起来像活在你的移动设备（任何与相机）使用世博应用程序。 它不仅具有实时更新，而且可以让您在terminal中查看控制台日志，就像在为Web开发时一样 ，而不必象以前一样使用浏览器。

当然，你将不得不用这个样板做一个新的项目…但是如果你需要迁移你的文件，这应该不成问题。 试一试。

编辑：其实它甚至不需要相机。 我曾经说过要扫描一个QR码，但是你也可以input一些东西来同步你的服务器，而不仅仅是一个二维码。

Answer 10

react-native-xlog模块，可以帮助你，是微信的Xlog for react-native。 这可以在Xcode控制台和日志文件中输出，产品日志文件可以帮助您debugging。

 Xlog.verbose('tag', 'log'); Xlog.debug('tag', 'log'); Xlog.info('tag', 'log'); Xlog.warn('tag', 'log'); Xlog.error('tag', 'log'); Xlog.fatal('tag', 'log'); 

Answer 11

这是Chrome开发人员工具是你的朋友的地方。

下面的步骤应该让你到Chrome开发工具，在那里你将能够看到你的console.log语句。

脚步

1. 安装谷歌浏览器 ，如果你还没有
2. 使用react-native run-android或react-native run-ios运行应用程序
3. 打开开发者菜单
   • Mac：适用于iOS的⌘+D或⌘M于Android iOS的⌘M
   • Windows / Linux：摇动Android手机
4. selectDebug JS Remotely
5. 这应该在Chrome中启动debugging器
6. 在Chrome中： Tools -> More Tools -> Developer Options ，并确保您在console选项卡上

现在，无论何时执行console.log语句，它都应该出现在Chrome开发工具中。 官方文件在这里 。

Answer 12

开发时间logging

对于开发时间日志logging，可以使用console.log（） 。 一个重要的事情是，如果你想禁止在生产模式下的日志logging，那么在应用程序的Root Js文件中，只需要像这样分配空白函数 – console.log = {}它将在整个应用程序中完全禁用整个日志发布，模式作为console.log消耗时间。

---

运行时间logging

在生产模式下，当真实用户实时使用您的应用程序时，还需要查看日志。 这有助于了解错误，使用情况和不需要的情况。 市场上有许多第三方付费工具。 其中我使用的是Logentries

好的是Logentry也有了React Native Module 。 因此，启动移动应用程序的运行时间logging将需要很less的时间。

Answer 13

你可以使用console.log（）或者console.error（）本地函数