'eas build -p android' gives error AAPT: error: resource color/splashscreen_background (aka com.xxxxx.xxxxx:color/splashscreen_background) not found

Question

I am using react native and try to create an apk file with "eas build -p android --profile preview --clear-cache" On https://expo.dev/ I see the following gradle build error.

`> Task :app:processReleaseResources FAILED FAILURE: Build failed with an exception.

• What went wrong: Execution failed for task ':app:processReleaseResources'.

A failure occurred while executing com.android.build.gradle.internal.res.LinkApplicationAndroidResourcesTask$TaskAction Android resource linking failed ERROR: /home/expo/workingdir/build/android/app/src/main/res/drawable/splashscreen.xml:3: AAPT: error: resource color/splashscreen_background (aka com.xxxxx.xxxxx:color/splashscreen_background) not found.

• Try:

Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights. Get more help at https://help.gradle.org. BUILD FAILED in 6m 49s`

My aps.json file looks like:

{ "expo": { "name": "Xxxxx", "slug": "Xxxxx", "owner": "xxxxx-xxxxx", "privacy": "public", "platforms": [ "ios", "android" ], "version": "0.0.1", "orientation": "portrait", "icon": "./assets/icon.png", "updates": { "fallbackToCacheTimeout": 0 }, "assetBundlePatterns": [ "**/*" ], "ios": { "supportsTablet": true, "bundleIdentifier": "com.xxxxx.xxxxx", "buildNumber": "1.0.0", "splash": { "image": "./assets/splash.png", "resizeMode": "contain", "backgroundColor": "#ffffff" } }, "android": { "package": "com.xxxxx.xxxxx", "versionCode": 1, "adaptiveIcon": { "foregroundImage": "./assets/adaptive-icon.png", "backgroundColor": "#FFFFFF" }, "splash": { "image": "./assets/splash.png", "resizeMode": "contain", "backgroundColor": "#ffffff" } }, "web": { "favicon": "./assets/favicon.png" }, "extra": { "eas": { "projectId": "e93c6d02-02d5-4238-8fe4-b03fdac9784b" } } } }

package.json file:

{ "name": "xxxxx", "version": "0.2.4", "main": "node_modules/expo/AppEntry.js", "scripts": { "start": "expo start", "tunnel": "expo start --tunnel", "android": "expo start --android", "ios": "expo start --ios", "web": "expo start --web", "test": "jest --verbose", "format": "prettier --write .", "storybook": "start-storybook -p 6006", "commit": "git add --all && git commit -m 'update' && git push", "storybook-generate": "sb-rn-get-stories --config-path .ondevice", "storybook-watch": "sb-rn-watcher --config-path .ondevice", "storybook:get": "sb-rn-get-stories --config-path .ondevice && STORYBOOK_ENABLED='true' expo start", "storybook:ios": "sb-rn-get-stories --config-path .ondevice && STORYBOOK_ENABLED='true' expo start --ios", "storybook:android": "sb-rn-get-stories --config-path .ondevice && STORYBOOK_ENABLED='true' expo start --android" }, "dependencies": { "@babel/preset-env": "^7.24.5", "@react-native-async-storage/async-storage": "1.21.0", "@react-native-community/datetimepicker": "7.6.1", "@react-native-community/slider": "4.4.2", "@react-navigation/native": "^6.0.0", "@react-navigation/native-stack": "^6.0.0", "@types/jest": "^29.5.2", "axios": "^1.6.8", "expo": "~50.0.6", "expo-constants": "~15.4.6", "expo-status-bar": "~1.11.1", "jest": "^29.2.1", "jest-expo": "~50.0.4", "react": "18.2.0", "react-dom": "18.2.0", "react-native": "0.73.6", "react-native-safe-area-context": "4.8.2", "react-native-screens": "~3.29.0", "react-native-swiper": "^1.6.0", "react-native-web": "~0.19.6", "regenerator-runtime": "^0.14.1" }, "devDependencies": { "@babel/core": "^7.24.5", "@babel/plugin-transform-runtime": "^7.24.3", "@storybook/addon-actions": "^6.5.16", "@storybook/addon-controls": "^6.5.16", "@storybook/addon-essentials": "^6.5.16", "@storybook/addon-links": "^6.5.16", "@storybook/addon-ondevice-actions": "^6.5.1", "@storybook/addon-ondevice-backgrounds": "^6.5.1", "@storybook/addon-ondevice-controls": "^6.5.1", "@storybook/addon-ondevice-notes": "^6.5.1", "@storybook/addon-react-native-web": "^0.0.19", "@storybook/builder-webpack5": "^6.5.14", "@storybook/manager-webpack5": "^6.5.14", "@storybook/react": "^6.5.16", "@storybook/react-native": "^6.5.7", "@testing-library/react-native": "^12.1.2", "@types/react": "~18.2.45", "atomic-bomb": "^5.0.0", "babel-loader": "^8.2.3", "babel-plugin-react-docgen-typescript": "^1.5.1", "babel-plugin-react-native-web": "^0.18.10", "metro-react-native-babel-preset": "^0.77.0", "typescript": "^5.3.0", "webpack": "^5.91.0" }, "resolutions": { "react-native-svg": "13.4.0" }, "private": true, "jest": { "preset": "jest-expo", "transformIgnorePatterns": [ "node_modules/(?!((jest-)?react-native|@react-native(-community)?)|expo(nent)?|@expo(nent)?/.*|@expo-google-fonts/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|react-native-svg)" ] }, "babel": { "presets": [ [ "@babel/preset-env", { "loose": true, "shippedProposals": true } ] ] } }

My eas.json file: { "cli": { "version": ">= 6.0.0" }, "build": { "development": { "developmentClient": true, "distribution": "internal" }, "preview": { "android": { "buildType": "apk" }, "distribution": "internal" }, "production": {} }, "submit": { "production": {} } }

metro.config.js:

const { getDefaultConfig } = require('expo/metro-config')

const defaultConfig = getDefaultConfig(__dirname)

defaultConfig.resolver.resolverMainFields = [ 'sbmodern', ...defaultConfig.resolver.resolverMainFields ]

defaultConfig.transformer.getTransformOptions = async () => ({ transform: { experimentalImportSupport: false, inlineRequires: false } })

defaultConfig.watchFolders = [...defaultConfig.watchFolders, './.ondevice']

module.exports = defaultConfig

I could not found a solution and I have no idea how to fix this. I tried to remove folder node-modules and did a npm install but did not help.

Answer 1

I had the same problem and I was able to add myself in the app.config splash file... my app.config code: export default { expo: { android: { package: "com.xxxxxxxx", versionCode: 3, name: "af", displayName: "af", icon: "./assets/af.png", targetSdkVersion: 34, adaptiveIcon: { foregroundImage: "./assets/af.png", backgroundColor: "#ffffff" } }, splash: { image: "./assets/splash.png", // Make sure this image exists and the path is correct resizeMode: "contain", // It can be "contain" or "cover" backgroundColor: " #ffffff" // Background color of the splash }, extra: { eas: { projectId: "xxxxxxxxx" } } } }; Remember to link app.config to app.json:

"extra": { "eas": { "projectId": "xxxxxxxxxxx" }, "config": "./app.config.js" }

Answer 2

Sorry for mine five cents but an error message say that color "splashscreen_background" doesn't define in resources. Just find a file values/colors.xml and add missed value.

Below an example of file content

<resources>
  <color name="colorPrimary">#023c69</color>
  <color name="colorPrimaryDark">#ffffff</color>
  <color name="splashscreen_background">#ffffff</color>
</resources>

Answer 3

remove the splash property content from ios and android and place it in on top in the app.json file.

after that run "expo prebuild"

after that run "expo run:android"

test it!