react-native常見錯誤整理

本文轉載自查看原文 2019-03-22 13:58 6019 react-native

1、CFBundleIdentifier", Does Not Exist

sudo rm -rf node_modules && rm -rf ~/.rncache && yarn

sudo npm install -g react-native-git-upgrade

2、Build input file cannot be found: 'xxx/third-party/double-conversion-1.1.5/'…

新建的React Native 項目，凡是版本號大於0.45的，iOS版本在build的時候會卡在build double conversion 這里。

查詢具體需要的三方庫
鏈接: https://pan.baidu.com/s/1-YccvCHdn17odP_RDl1J8w 提取碼: grdc
下下來后，把這些壓縮文件放到 ~/.rncache（Mac操作：Finder=》前往文件夾=》~/.rncache)

3、third-party/glog-0.3.4/src/base/mutex.h:105:10: 'config.h' file not found

cd node_modules/react-native/third-party/glog-0.3.4

../../scripts/ios-configure-glog.sh

4、React Native version mismatch

watchman watch-del-all && react-native start --reset-cache

This might be related to https://github.com/facebook/react-native/issues/4968

To resolve try the following:

1. Clear watchman watches: `watchman watch-del-all`.

2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.

3. Reset Metro Bundler cache: `rm -fr $TMPDIR/react-*` or `npm start -- --reset-cache`.

5、權限問題

chown -R wood:staff ~/.npm 讓該目錄下的所有文件都有wood用戶權限

groups 查看當前用戶所屬組

groups wood 查看指定用戶所屬組

id -a wood 可以查到指定用戶所屬組更詳細的信息

whoami 查看當前用戶的用戶名

6、Execution failed for task ':app:installDebug'.

at com.android.ddmlib.Device.installPackage(Device.java:869)

> com.android.builder.testing.api.DeviceException: com.android.ddmlib.InstallException: INSTALL_FAILED_INSUFFICIENT_STORAGE

at com.android.builder.testing.ConnectedDevice.installPackage

是因為包名和簽名的信息與原先手機上的沖突，最簡單的方式，通過adb uninstall packageName將原來的App卸載干凈，重新執行就可以成功了

7、Attempted to transition from state RESPONDER_INACTIVE_PRESS_IN to RESPONDER_ACTIVE_LONG_PRESS_IN, which is not supported. This is most likely due to Touchable.longPressDelayTimeout not being cancelled.

https://github.com/facebook/react-native/issues/5823

這是開啟了Debug JS Remotely模式

8、React-Native判斷Debug/Release

//在Android Studio項目中
if(BuildConfig.DEBUG){
//debug模式
}else{
//release模式
}

iOS項目判斷方法

#ifdef DEBUG
// debug模式
#else
//release 模式
#endif

React-Native項目判斷方法

if(__DEV__){
// debug模式
}else{
// release模式
}

Android打包

build_apk.sh
#!/bin/bash
rm android/app/build/outputs/app-release.apk
cd android
./gradlew assembleRelease

react-native -> jsbundle，將RN代碼和資源文件打包成jsbundle放在app或apk中，這樣可以不依賴於開發服務器在真機上運行

react-native bundle 命令

iOS項目：

1. 工程目錄下執行

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

2. 在xcode中添加bundle文件夾

3. 在AppDelegate.m中選擇使用main.jsbundle

jsCodeLocation = [[NSBundle mainBundle] URLForResource:@”index.ios” withExtension:@”jsbundle”];

Android項目：

react-native bundle --platform android --entry-file index.js --reset-cache --bundle-output android/app/src/main/assets/index.android.bundle --dev false --assets-dest android/app/src/main/res/

9、Android生成已簽名的apk時構建時可能出現的錯誤

Duplicate resources

請刪除drawable-xxx下面的資源文件，因為在打包apk官方文檔中有說明，Gradle 的assembleRelease參數會把所有用到的 JavaScript 代碼都打包到一起，然后內置到 APK 包中。

所以打包apk前不用執行react-native bundle 命令來打出jsbundle，assembleRelease已經包含了這個功能，這回導致資源文件重復而報錯。

該刪的都刪掉吧！

10、Cannot set build number with plist path containing $(SRCROOT)

Please remove $(SRCROOT) in your Xcode target build settings

解決方法一：

https://stackoverflow.com/questions/3730186/how-do-i-force-xcode-to-rebuild-the-info-plist-file-in-my-project-every-time-i-b

解決方法二：

模仿tvOS/Info.plist，去掉$(SRCROOT)改為相對路徑

11、Android RCTWeChat接入注意事項

> Task :react-native-update:verifyReleaseResources FAILED

FAILURE: Build failed with an exception.

-----------

debug/release運行沒問題，包括用Android Studio生成已簽名的apk也沒問題，但是自動化打包（./gradlew assembleRelease）失敗

類似這種錯誤需要做以下修改：

保證app/build.gradle中的dependences與依賴工程中的一致，建議都改為implementation，可以參考國外人寫的工程（這里需要吐槽下騰訊）

settings.gradle把react-native-wechat 改為RCTWeChat

rootProject.name = 'superbuy'
include ':react-native-fetch-blob'
project(':react-native-fetch-blob').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fetch-blob/android')

include ':react-native-device-info'
project(':react-native-device-info').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-device-info/android')

include ':react-native-i18n'
project(':react-native-i18n').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-i18n/android')

include ':jcore-react-native'
project(':jcore-react-native').projectDir = new File(rootProject.projectDir, '../node_modules/jcore-react-native/android')

include ':jpush-react-native'
project(':jpush-react-native').projectDir = new File(rootProject.projectDir, '../node_modules/jpush-react-native/android')

include ':react-native-webview'
project(':react-native-webview').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-webview/android')

include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')

include ':RCTWeChat'
project(':RCTWeChat').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-wechat/android')

include ':react-native-video'
project(':react-native-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android-exoplayer')

include ':react-native-vector-icons'
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')

include ':react-native-splash-screen'
project(':react-native-splash-screen').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-splash-screen/android')

include ':react-native-linear-gradient'
project(':react-native-linear-gradient').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-linear-gradient/android')

include ':react-native-image-picker'
project(':react-native-image-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-image-picker/android')

include ':react-native-update'
project(':react-native-update').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-update/android')

include ':react-native-code-push'
project(':react-native-code-push').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-code-push/android/app')

include ':app'

app/build.gradle

compile是過期的用法要改為implementation，並且相應的依賴工程也需要改為implementation

apply plugin: "com.android.application"

import com.android.build.OutputFile

project.ext.react = [
    entryFile: "index.js"
]

apply from: "../../node_modules/react-native/react.gradle"
apply from: "../../node_modules/react-native-code-push/android/codepush.gradle"

def enableSeparateBuildPerCPUArchitecture = false

def enableProguardInReleaseBuilds = false

android {
    signingConfigs {
        config {
            keyAlias 'release'
            keyPassword 'xxxxxx'
            storeFile file('/Users/wood/Documents/xxx/android/keystores/release.keystore')
            storePassword 'xxxxxx'
        }
    }
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
    compileSdkVersion rootProject.ext.compileSdkVersion
    buildToolsVersion rootProject.ext.buildToolsVersion
    defaultConfig {
        applicationId "com.xxx.xxx"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode hasProperty("VERSION_CODE") ? Integer.parseInt(VERSION_CODE) + 1 : 1
        project.setProperty("VERSION_CODE", versionCode)
        versionName hasProperty("VERSION_NAME") ? VERSION_NAME : "1.0.0"
        manifestPlaceholders = [
                JPUSH_APPKEY: "xxxxxxxxxxxxxxxxxxx",
                APP_CHANNEL : "default"
        ]

    }
    splits {
        abi {
            reset()
            enable enableSeparateBuildPerCPUArchitecture
            universalApk false  // If true, also generate a universal APK
            include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
        }
    }
    buildTypes {
        release {
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
            signingConfig signingConfigs.config
            buildConfigField "String", "CODEPUSH_KEY", CODEPUSH_KEY_PRODUCTION
            buildConfigField "boolean", "IS_CODEPUSH", "true"
        }
        debug {
            applicationIdSuffix ".debug" // 在模擬器上同時安裝debug/release包
            buildConfigField "String", "CODEPUSH_KEY", CODEPUSH_KEY_STAGING
            buildConfigField "boolean", "IS_CODEPUSH", "true"
        }
    }
    // applicationVariants are e.g. debug, release
    applicationVariants.all { variant ->
        variant.outputs.each { output ->
            // For each separate APK per architecture, set a unique version code as described here:
            // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits
            def versionCodes = ["armeabi-v7a":1, "x86":2, "arm64-v8a": 3, "x86_64": 4]
            def abi = output.getFilter(OutputFile.ABI)
            if (abi != null) {  // null for the universal-debug, universal-release variants
                output.versionCodeOverride =
                        versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
            }
        }
    }
}

dependencies {
    implementation project(':react-native-update')
    implementation project(':react-native-code-push')
    implementation project(':react-native-fetch-blob')
    implementation project(':react-native-update')
    implementation project(':react-native-device-info')
    implementation project(':react-native-i18n')
    implementation project(':jcore-react-native')
    implementation project(':jpush-react-native')
    implementation project(':react-native-webview')
    implementation project(':react-native-gesture-handler')
    implementation project(':react-native-video')
    implementation project(':react-native-vector-icons')
    implementation project(':react-native-splash-screen')
    implementation project(':react-native-linear-gradient')
    implementation project(':react-native-image-picker')
    // 微信不使用自動鏈接react-native-wechat
    implementation project(':RCTWeChat')

    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"
    implementation "com.facebook.react:react-native:+"  // From node_modules
    // From node_modules
    // 如果你需要支持GIF動圖
    implementation 'com.facebook.fresco:animated-gif:1.10.0'
    // 如果你需要支持WebP格式，包括WebP動圖
    implementation 'com.facebook.fresco:animated-webp:1.10.0'
    implementation 'com.facebook.fresco:webpsupport:1.10.0'
}

// Run this once to be able to run the application with BUCK
// puts all compile dependencies into folder libs for BUCK to use
task copyDownloadableDepsToLibs(type: Copy) {
    from configurations.compile
    into 'libs'
}

依賴工程：

RCTWeChat/build.gradle

apply plugin: 'com.android.library'

def DEFAULT_COMPILE_SDK_VERSION             = 28
def DEFAULT_BUILD_TOOLS_VERSION             = "28.0.0"
def DEFAULT_TARGET_SDK_VERSION              = 28

android {
//  compileSdkVersion 23
//  buildToolsVersion "23.0.1"
  compileSdkVersion project.hasProperty('compileSdkVersion') ? project.compileSdkVersion : DEFAULT_COMPILE_SDK_VERSION
  buildToolsVersion project.hasProperty('buildToolsVersion') ? project.buildToolsVersion : DEFAULT_BUILD_TOOLS_VERSION

  defaultConfig {
    minSdkVersion 16
//    targetSdkVersion 22
    targetSdkVersion project.hasProperty('targetSdkVersion') ? project.targetSdkVersion : DEFAULT_TARGET_SDK_VERSION
    versionCode 1
    versionName "1.0"
    ndk {
      abiFilters "armeabi-v7a", "x86"
    }
  }
}

allprojects {
  repositories {
    jcenter()
    maven { url "$projectDir/../../react-native/android" }
  }
}

dependencies {
  implementation 'com.facebook.react:react-native:+' // compile -> implementation
  compile files('libs/libammsdk.jar')
}

react-native-fetch-blob/build.gradle

apply plugin: 'com.android.library'

repositories {
    mavenCentral()
}

buildscript {
    repositories {
        jcenter()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:2.2.3'
    }
}

def DEFAULT_COMPILE_SDK_VERSION             = 28
def DEFAULT_BUILD_TOOLS_VERSION             = "28.0.0"
def DEFAULT_TARGET_SDK_VERSION              = 28

android {
//    compileSdkVersion 23
//    buildToolsVersion "23.0.1"
    compileSdkVersion project.hasProperty('compileSdkVersion') ? project.compileSdkVersion : DEFAULT_COMPILE_SDK_VERSION
    buildToolsVersion project.hasProperty('buildToolsVersion') ? project.buildToolsVersion : DEFAULT_BUILD_TOOLS_VERSION

    defaultConfig {
        minSdkVersion 16
//        targetSdkVersion 23
        targetSdkVersion project.hasProperty('targetSdkVersion') ? project.targetSdkVersion : DEFAULT_TARGET_SDK_VERSION
        versionCode 1
        versionName "1.0"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
    productFlavors {
    }
}

dependencies {
    implementation 'com.facebook.react:react-native:+' // compile -> implementation
    //{RNFetchBlob_PRE_0.28_DEPDENDENCY}
}

react-native-i18n/build.gradle

dependencies {
  implementation "com.facebook.react:react-native:+" // compile -> implementation
}

關於這個問題，其他的三方庫都可以按照這個規格修改，本質都是構建版本不一致問題。

戳這里下載這都是修改好的，直接拿去用吧

-----------

12、iOS RCTWeChat接入注意事項

13、iOS Cannot set build number with plist path containing $(SRCROOT) Please remove $(SRCROOT) in your Xcode target build settings

Please remove $(SRCROOT) in your Xcode target build settings

fastlane 無法識別出 $(SRCROOT)的路徑，移除 $(SRCROOT)/ xcode還是會找到Info.plist文件，如何按照提示只移除$(SRCROOT)那確實是找不到的

https://stackoverflow.com/questions/49429944/cannot-find-srcroot-agvtool-increment-build-number-fastlane

The current solution to your problem would be to remove the $(SRCROOT) from your build settings. $(SRCROOT) means "directory where .xcodeproj is" so you will be perfectly fine to remove it (Xcode will still look for it relatively from the .xcodeproj).

We've recently removed agvtool from the get_version_number action (in version 2.87.0 in favor of using the xcodeproj gem where we can more nicely handle which target is found, handle $(SRCROOT), and remove that "avgtool setup process". I will be working on replacing agvtool in increment_build_number and get_build_number soon which should hopefully prevent further issues like this one.

14、 Error:The minSdk version should not be declared in the android manifest file

Error:The minSdk version should not be declared in the android manifest file. You can move the version from the manifest to the defaultConfig in the build.gradle file.

解決方案把manifest.xml 里的sdk最小版本設置都刪掉 Androidstudio3.0 以后不能在manifest.xml 設置這些必須在 gradle里設置

15、 Android mnifest file merging error tool:allowBackup=true

for attribute android:allowBackup, but no new value specified

這種類似問題，都是mainfest文件合並失敗，建議所有mainfest.xml都加上

</application>

16、 Android怎么編譯都不通過 gradle.properties版本變更或

修改或更新了distributionUrl=https\://services.gradle.org/distributions/gradle-4.10.2-all.zip

~/.gradle 下面會有緩存，而由於刪除了緩存文件導致找不到，Extenal Libraries會大片的飄紅，解決方法是先移除這些依賴，再重新編譯（這個問題影響了我好多天fuck）

17、設置gradle阿里雲鏡像

新增文件：~/.gradle/init.gradle (全局代理一次性解決所有項目gradle被牆問題)

allprojects{
    repositories {
        def ALIYUN_REPOSITORY_URL = 'http://maven.aliyun.com/nexus/content/groups/public'
        def ALIYUN_JCENTER_URL = 'http://maven.aliyun.com/nexus/content/repositories/jcenter'
        all { ArtifactRepository repo ->
            if(repo instanceof MavenArtifactRepository){
                def url = repo.url.toString()
                if (url.startsWith('https://repo1.maven.org/maven2')) {
                    project.logger.lifecycle "Repository ${repo.url} replaced by $ALIYUN_REPOSITORY_URL."
                    remove repo
                }
                if (url.startsWith('https://jcenter.bintray.com/')) {
                    project.logger.lifecycle "Repository ${repo.url} replaced by $ALIYUN_JCENTER_URL."
                    remove repo
                }
            }
        }
        maven {
            url ALIYUN_REPOSITORY_URL
            url ALIYUN_JCENTER_URL
        }
    }
}

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 react-native打包apk常見錯誤收集 react-native入門 [react-native]react-native填坑筆記 react-native 之ScrollView的使用 vscode 搭建react-native react-native開發經驗 react-native中的TextInput react-native調試方法 React-Native 之 TextInput使用 react-native StatusBar透明