React Native 报错总结

版本：0.63

一、编译成功，刚运行报错：

com.github.facebook.watchman.plist for write: Permission denied

/Users/XX/Library/LaunchAgents 没有写入权限。
右键 -> 显示简介 -> 把三个权限都改为“读与写” -> 再编译运行即可

权限设置

二、编译成功，刚运行时候报错

No bundle URL present
Make Sure you are running a packager server or have included a .jsbundle file in your application bundle

1.如果是真机测试，首先确定代码localhost处有没有改为电脑IP地址。并可以参考文章：iOS 真机 No bundle URL present，打断点看是否真的读取到正确的IP地址了。
2.把这个jsbundle添加到Copy Bundle Resources里。

添加main.jsbundle
3.参考：React Native运行样例的时候出错解决办法。安装Watchman就好了。
安装教程 图片来源：搭建开发环境 · React Native 中文网

#先更换源 使用nrm工具切换淘宝源（否则超级慢）
$ npx nrm use taobao

#安装Watchman
$ brew install watchman

安装好Watchman之后可以直接成功运行了。

三、启动端口报错：

react-native start --port 8081 //我的代码默认为8081，需要看代码确定下

Error: EMFILE: too many open files, watch at FSEvent.FSWatcher._handle.onchange (fs.js:1370:28) 

安装Watchman之后就好了。安装命令参考上一个错误的解决办法。

四、拖入本地原生插件，插件报错

'React/RCTDefines.h' file not found

头文件file not found

1.确定插件工程有没有复制进项目的node_modules文件夹内，如果未复制进，需要删掉已经依赖的静态库(插件)工程（选择Remove Preference），然后复制本地插件到工程目录下，再重新拖入复制进工程目录下的静态库(插件)工程。
2.插件（静态库工程）的Header Search Path有没有配置且配置正确

#需要添加两项，并且确定相对路径是否真实存在并且正确
$(SRCROOT)/../../../React
$(SRCROOT)/../../react-native/React
#两项都要配置为recursive

文件夹目录结构示意图
3.#import <React/RCTBridgeModule.h>改为#import "RCTBridgeModule.h"
(或#import <React/RCTBridge.h>改为#import "RCTBridge.h")
然后进入RCTBridgeModule.h中（即报错位置，不知道是哪个文件的话可以在报错上右键 -> 选择【Reveal in Log】就能看到）
报错具体位置为第三方的RCTBridgeModule.h里的import语句

把RCTBridgeModule.h里#import <React/RCTDefines.h>改为#import "RCTDefines.h"
就编译通过了

五、用npm集成原生插件(例如调用系统相册插件react-native-image-picker)，JS引用后运行报错

[Wed Sep 09 2020 16:12:33.348]  ERROR    Error: react-native-image-picker: NativeModule.ImagePickerManager is null. To fix this issue try these steps:
• Run `react-native link react-native-image-picker` in the project root.
• Rebuild and re-run the app.
• If you are using CocoaPods on iOS, run `pod install` in the `ios` directory and then rebuild and re-run the app. You may also need to re-open Xcode to get the new pods.
• Check that the library was linked correctly when you used the link command by running through the manual installation instructions in the README.
* If you are getting this error while unit testing you need to mock the native module. Follow the guide in the README.
If none of these fix the issue, please open an issue on the Github repository: https://github.com/react-native-community/react-native-image-picker
[Wed Sep 09 2020 16:12:33.349]  ERROR    Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication)
[Wed Sep 09 2020 16:12:34.411]  ERROR    Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication)

我使用npm集成的命令步骤为：

$ yarn add react-native-image-picker

$ react-native link react-native-image-picker

看项目Pod目录里根本没有这个文件夹，项目配置Frameworks, Libraries, and Embedded Content里也没有这个库
翻官方文档：react-native-image-picker - npm 看到

yarn add react-native-image-picker

# RN >= 0.60（0.60以上的版本需要使用👇这个命令集成）
npx pod-install

# RN < 0.60（0.60以下才使用这个）
react-native link react-native-image-picker