关于React Native 中升级Gradle版本之后打包出现图片重复问题

昨天我升级android studio 3.0之后，Gradle版本也同样升级了，但是升级之后打包出现node_modules_reactnavigation_src_views_assets_backicon.png图片重复问题，这个原因我在Github上面找了好久，才发现是因为Gradle2.3之后，离线打包的路径都会在drawable-xxx-v4中，原版的离线路径在drawable-xxx中，所以导致图片重复问题，怎么解决这个问题呢：

1，修改assetPathUtils.js

assetPathUtils.js文件路径：node_modulesreact-nativelocal-clibundleassetPathUtils.js

修改：getAndroidAssetSuffix方法

function getAndroidAssetSuffix(scale) {
switch (scale) {
case 0.75: return 'ldpi-v4';
case 1: return 'mdpi-v4';
case 1.5: return 'hdpi-v4';
case 2: return 'xhdpi-v4';
case 3: return 'xxhdpi-v4';
case 4: return 'xxxhdpi-v4';
case 0.75: return 'ldpi';
case 1: return 'mdpi';
case 1.5: return 'hdpi';
case 2: return 'xhdpi';
case 3: return 'xxhdpi';
case 4: return 'xxxhdpi';
}
}

2，修改react.gradle

react.gradle文件路径：node_modulesreact-nativereact.gradle

在gradle.projectsEvaluated方法中添加：

gradle.projectsEvaluated {
def isAndroidLibrary = plugins.hasPlugin("com.android.library")
// Grab all build types and product flavors
def buildTypes = android.buildTypes.collect { type -> type.name }
def productFlavors = android.productFlavors.collect { flavor -> flavor.name }

// When no product flavors defined,use empty
if (!productFlavors) productFlavors.add('')

productFlavors.each { productFlavorName ->
buildTypes.each { buildTypeName ->
// Create variant and target names
def flavorNameCapitalized = "${productFlavorName.capitalize()}"
def buildNameCapitalized = "${buildTypeName.capitalize()}"
def targetName = "${flavorNameCapitalized}${buildNameCapitalized}"
def targetPath = productFlavorName ?
"${productFlavorName}/${buildTypeName}" :
"${buildTypeName}"

// React js bundle directories
def jsBundleDirConfigName = "jsBundleDir${targetName}"
def jsBundleDir = elvisFile(config."$jsBundleDirConfigName") ?:
file("$buildDir/intermediates/assets/${targetPath}")

def resourcesDirConfigName = "resourcesDir${targetName}"
def resourcesDir = elvisFile(config."${resourcesDirConfigName}") ?:
file("$buildDir/intermediates/res/merged/${targetPath}")
def jsBundleFile = file("$jsBundleDir/$bundleAssetName")

// Bundle task name for variant
def bundleJsAndAssetsTaskName = "bundle${targetName}JsAndAssets"

// Additional node and packager commandline arguments
def nodeExecutableAndArgs = config.nodeExecutableAndArgs ?: ["node"]
def extraPackagerArgs = config.extraPackagerArgs ?: []

def currentBundleTask = tasks.create(
name: bundleJsAndAssetsTaskName,
type: Exec) {
group = "react"
description = "bundle JS and assets for ${targetName}."

// Create dirs if they are not there (e.g. the "clean" task just ran)
doFirst {
jsBundleDir.mkdirs()
resourcesDir.mkdirs()
}

// Set up inputs and outputs so gradle can cache the result
inputs.files fileTree(dir: reactRoot,excludes: inputExcludes)
outputs.dir jsBundleDir
outputs.dir resourcesDir

// Set up the call to the react-native cli
workingDir reactRoot

// Set up dev mode
def devEnabled = !(config."devDisabledIn${targetName}"
|| targetName.toLowerCase().contains("release"))
if (Os.isFamily(Os.FAMILY_WINDOWS)) {
commandLine("cmd","/c",*nodeExecutableAndArgs,cliPath,"bundle","--platform","android","--dev","${devEnabled}",
"--reset-cache","--entry-file",entryFile,"--bundle-output",jsBundleFile,"--assets-dest",resourcesDir,*extraPackagerArgs)
} else {
commandLine(*nodeExecutableAndArgs,*extraPackagerArgs)
}

enabled config."bundleIn${targetName}" ||
config."bundleIn${buildTypeName.capitalize()}" ?:
targetName.toLowerCase().contains("release")
if (isAndroidLibrary) {
doLast {
def moveFunc = { resSuffix ->
File originalDir = file("${resourcesDir}/drawable-${resSuffix}")
if (originalDir.exists()) {
File destDir = file("${resourcesDir}/drawable-${resSuffix}-v4")
ant.move(file: originalDir,tofile: destDir)
}
}
moveFunc.curry("ldpi").call()
moveFunc.curry("mdpi").call()
moveFunc.curry("hdpi").call()
moveFunc.curry("xhdpi").call()
moveFunc.curry("xxhdpi").call()
moveFunc.curry("xxxhdpi").call()
}
}
}

// Hook bundle${productFlavor}${buildType}JsAndAssets into the android build process
currentBundleTask.dependsOn("merge${targetName}Resources")
currentBundleTask.dependsOn("merge${targetName}Assets")

runBefore("process${flavorNameCapitalized}Armeabi-v7a${buildNameCapitalized}Resources",currentBundleTask)
runBefore("process${flavorNameCapitalized}X86${buildNameCapitalized}Resources",currentBundleTask)
runBefore("processUniversal${targetName}Resources",currentBundleTask)
runBefore("process${targetName}Resources",currentBundleTask)
runBefore("dataBindingProcessLayouts${targetName}",currentBundleTask)
}
}
}

以上方法二选一

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!