打包检测命令

npx react-native run-android --variant=release

android 端打包之前要先执行yarn bundle-android命令,生成新的 bundle

清除缓存的相关命令

按顺序执行前三条即可

  1. Clear watchman watches: watchman watch-del-all.
  2. npm cache clean --force
  3. yarn start --reset-cache //yarn start -- --reset-cache

iOS端报错以及相关解决方案

1、aurora-imui报错

ld: library 'React' not found(类似的报错也是相同的解决方式)

修复方式: https://github.com/jpush/aurora-imui/issues/669

2、ios端,权限错误提示

Check that you are correctly calling setup_permissions in your Podfile.
• Uninstall this app, reinstall your Pods, delete your Xcode DerivedData folder and rebuild it.

解决方案:
https://github.com/zoontek/react-native-permissions/issues/449

3、Error: Unable to resolve module ./Libraries/Components/DatePicker/DatePickerIOS

解决方案: https://stackoverflow.com/questions/77319211/react-native-error-datepickerios-not-found/78560836

4、/XXX/ios/Pods/Headers/Private/RCT-Folly/folly/portability/Time.h:52:17 Typedef redefinition with different types ('uint8_t' (aka 'unsigned char') vs 'enum clockid_t')

解决方法:进入到该文件中,注释掉typedef uint8_t clockid_t;(在第52行)

5、Xcode 报 unexpected service error: The Xcode build system has crashed. Build again to continue.

解决方案: https://stackoverflow.com/questions/78995007/xcode-16-0-unexpected-service-error-the-xcode-build-system-has-crashed

android 端报错和相关解决方案

1、null is not an object ( evaluating 'RNGestureHandlerModule.Direction')的坑

解决方案:
注释掉 GestureHandler.js 中//export { default as Directions } from './Directions';

2、 程序包com.facebook.react.views.webview不存在 import com.facebook.react.views.webview.ReactWebViewManager;

解决方案: 找到 node_modules/react-native-doc-viewer/android/src/main/java/com/reactlibrary/RNReactNativeDocViewerModule.java 文件中,直接注释掉 import com.facebook.react.views.webview.ReactWebViewManager即可

3、找不到符号

错误描述: 找不到符号 receiver, filter, exported ? Context.RECEIVER_EXPORTED : Context.RECEIVER_NOT_EXPORTED);
这个是版本兼容问题:直接修改代码。

4、打包时报资源重复(Error: Duplicate resources - ReactNative)

解决办法:
https://github.com/facebook/react-native/blob/2d9e2f30e17b8e79f2c44ef533ecdd550671304c/react.gradle(替换react.gradle文件)

5、报地图资源重复

错误描述信息: Duplicate class com.amap.api.location.UmidtokenInfo$a found in modules jetified-3dmap-9.6.0 (com.amap.api:3dmap:9.6.0) and jetified-location-6.2.0 (com.amap.api:location:6.2.0)

react-native-amap-geolocation模块下的 lib/android/build.gradle文件中 implementation 'com.amap.api:location:6.2.0' 修改为 compileOnly 'com.amap.api:location:6.2.0'

6、android/build.gradle 的关键配置

//Option 2 (legacy GooglePlay dependency but using AndroidX):

    googlePlayServicesIidVersion = "17.0.0" // default: "17.0.0" - AndroidX
    supportLibVersion = '1.0.2' // Use '28.0.0' or don't specify for old libraries, '1.0.2' or similar for AndroidX
    mediaCompatVersion = '1.0.1' // Do not specify if using old libraries, specify '1.0.1' or similar for androidx.media:media dependency
    supportV4Version = '1.0.0' // Do not specify if using old libraries, specify '1.0.0' or similar for androidx.legacy:legacy-support-v4 dependency

7、TypeError: null is not an object (evaluating'_ReanimatedModule.default.createNode')

解决方法:首先确保react-native-reanimated已经正确安装, 然后执行npx react-native link react-native-reanimated进行链接。

8、android端报http协议问题

错误描述: Using insecure protocols with repositories, without explicit opt-in, is unsupported. Switch Maven repository 'maven(http://repo.lovebing.net/repository/maven-public/)' to redirect to a secure protocol (like HTTPS) or allow insecure protocols.
解决方法,在对应的链接处加上:allowInsecureProtocol true

9、react-native/Libraries/Animated/src/Easing could not be found within the project or in these directories

错误位置:/Users/ningjianwen/Desktop/toucan-cloud-mobile-dms/node_modules/teaset/components/ListRow/TouchableOpacity.js

解决方案:找到报错的文件,把 import Easing from 'react-native/Libraries/Animated/src/Easing修改为 import Easing from 'react-native/Libraries/Animated/Easing

10、Invariant Violation: requireNativeComponent: "RNCSafeAreaProvider" was not found in the UIManager.

解决方案1:https://blog.csdn.net/luoliwoshang/article/details/119951003
解决方案2:https://www.imangodoc.com/K8kqkrVf.html

11、Picker has been removed from React Native. It can now be installed and imported from '@react-native-picker/picker' instead of 'react-native'. See https://github.com/

react-native-picker/picker

解决方案:
找到提示信息所在,注释掉,替换为 return require('@react-native-picker/picker')

12、Unable to resolve module @swc/helpers/cjs/_class_private_field_init.cjs from /Users/mrv/Desktop/Projects/art-hearts-mobile/node_modules/@react-aria/interactions/dist/main.js

解决方案:https://github.com/adobe/react-spectrum/issues/4894

13、react-native-scrollable-tab-view库太旧,本身有问题

现象是 用到该库的地方闪退

解决方案:(有两处需要修改)
1.
查看错误日志发现是1.0版本使用的语法是require的方式引入。后来发现react-native-scrollable-tab-view 中引入了:
@react-native-community/viewpager
所以进入react-native-scrollable-tab-view 源码;
把index.js中的 const ViewPager = require('@react-native-community/viewpager');
改成:import ViewPager from '@react-native-community/viewpager';

2.

goToPage(pageNumber) {
    if (Platform.OS === 'ios') {
      const offset = pageNumber * this.state.containerWidth;
      if (this.scrollView) {
        // this.scrollView.getNode().scrollTo({x: offset, y: 0, animated: !this.props.scrollWithoutAnimation, });
        this.scrollView.scrollTo({x: offset, y: 0, animated: !this.props.scrollWithoutAnimation, });
      }
    } else {
      if (this.scrollView) {
        if (this.props.scrollWithoutAnimation) {
          this.scrollView.getNode().setPageWithoutAnimation(pageNumber);
        } else {
          // this.scrollView.getNode().setPage(pageNumber);
          this.scrollView.setPage(pageNumber);
        }
      }
    }

使用指定的RN版本号创建项目

npx react-native@0.62.3 init TestDeviceInfo --version 0.62.3
指令模板:npx react-native@0.62.3 init 项目名 --version 0.62.3,版本号的位置(0.62.3)替换为你需要的版本号即可。


蓝光95
210 声望16 粉丝

一名从业多年的软件开发者,做过5年的iOS开发,做过一年的react-native开发,有iOS性能优化经验,IM开发经验,会小程序的开发,现在在昆明从事移动前端开发的工作。