React Native--常见问题汇总

React Navite

问题汇总：

1. /Users/xxx/Desktop/Finance/xxxx/ios/bundle/main.jsbundle: No such file or directory

2. import <fishhook/fishhook.h> file not found

3. import <RCTAnimation/RCTValueAnimatedNode.h> file not found

4. 'config.h' file not found

5. 'error:/Users/......./SupportFiles/main.jsbundle: No such file or directory'

6. 'React/RCTBridgeModule.h' file not found

7. Could not build Objective-C module 'React'

1. main.jsbundle: No such file or directory

 /Users/xxx/Desktop/Finance/PaishengFinance/ios/bundle/main.jsbundle: No such file or directory

解决方案：

方案一：使用如下命令生成 main.jsbundle，然后拖到项目中的bundle目录下

react-native bundle --entry-file index.js --platform ios --dev false --bundle-output ./ios/bundle/main.jsbundle --assets-dest ./ios/bundle

其中我们常使用的一线命令选项：

• --entry-file ,ios或者android入口的js名称，比如index.js
• --platform ,平台名称(ios或者android)
• --dev ,设置为false的时候将会对JavaScript代码进行优化处理。
• --bundle-output, 生成的jsbundle文件的名称，比如./ios/bundle/main.jsbundle
• --assets-dest 图片以及其他资源存放的目录,比如./ios/bundle

解决方案二：把命令直接写入npm script(package.json中)脚本中

"scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "bundle-ios":"react-native bundle --entry-file index.js --platform ios --dev false --bundle-output ./ios/bundle/main.jsbundle --assets-dest ./ios/bundle"
  },

然后在终端执行npm run bundle-ios命令即可

修改RN入口代码

• Debug Server上的设置

let jsCodeLocation = URL(string: "http://localhost:8081/index.bundle?platform=ios")

• 设置离线的jsCodeLocation

let jsCodeLocation = Bundle.main.url(forResource: "bundle/main", withExtension: "jsbundle")

• 如果在项目中使用了CodePush热更新

let jsCodeLocation = CodePush.bundleURL()

温馨提示：上传代码的时候，如果.gitignore文件中有忽略*.jsbundle后缀的，先把它注释掉再上传

2. #import <fishhook/fishhook.h> file not found

解决方案：在package.json文件脚本scripts中添加如下代码

"fishhookinstall": "sed -I '' 's#<fishhook/fishhook.h>#\"fishhook.h\"#g' ./node_modules/react-native/Libraries/WebSocket/RCTReconnectingWebSocket.m",

然后终端执行：npm run fishhookinstall 或 npm run bundle-ios

3. #import <RCTAnimation/RCTValueAnimatedNode.h> file not found

解决方案：在package.json文件脚本scripts中添加如下代码

"nodeinstall": "sed -I '' 's\/#import <RCTAnimation\\/RCTValueAnimatedNode.h>\/#import \"RCTValueAnimatedNode.h\"\/' ./node_modules/react-native/Libraries/NativeAnimation/RCTNativeAnimatedNodesManager.h",

然后终端执行：npm run nodeinstall 或 npm run bundle-ios

4. 'config.h' file not found

解决方案：

// 1. 进入脚本目录，并运行脚本
cd node_modules/react-native/third-party/glog-0.3.4
../../scripts/ios-configure-glog.sh

// 2. 重新编辑运行即可

5. 'error:/Users/......./SupportFiles/main.jsbundle: No such file or directory'

// 1.项目根目录下执行
npm run build-ios

// 2.把项目中旧的main.jsbundle和assets删除，从bundle文件中重新拖进来，选项如下：

6. 'React/RCTBridgeModule.h' file not found

• (1). 进入scheme管理界面：Product -> Scheme -> Manage Scheme -> 双击你的项目；
• (2). 点击‘ build’；
• (3). 取消'Parallelize Build'勾选；
• (4). 点击“+”号，添加“React”库；
• (5). 把添加的“React”库，拖到最上面，再次运行即可；

7. Could not build Objective-C module 'React'

由于RN项目用pod引入了React相关的库，运行的时候报Could not build Objective-C module 'React'错误。

解决方案：

进入如下(个人/资源库/Developer/Xcode/DerivedData/)目录，清空DerivedData目录下的所以缓存文件，重新运行项目即可。

持续更新中……