Icons do not show in APK when building using Expo EAS SDK 53

[ahmedouvadel]

: Package.json {
"name": "maurieats",
"main": "expo-router/entry",
"version": "1.0.0",
"scripts": {
"start": "expo start",
"reset-project": "node ./scripts/reset-project.js",
"android": "expo run:android",
"ios": "expo run:ios",
"web": "expo start --web",
"test": "jest --watchAll",
"lint": "expo lint"
},
"jest": {
"preset": "jest-expo"
},
"dependencies": {
"@expo-google-fonts/inter": "^0.3.0",
"@expo-google-fonts/poppins": "^0.3.1",
"@expo/vector-icons": "^14.1.0",
"@react-native-async-storage/async-storage": "^2.1.2",
"@react-native-picker/picker": "^2.9.0",
"@react-navigation/bottom-tabs": "^7.2.0",
"@react-navigation/native": "^7.0.14",
"@stomp/stompjs": "^7.1.1",
"axios": "^1.8.2",
"dayjs": "^1.11.13",
"expo": "53.0.9",
"expo-auth-session": "~6.1.5",
"expo-blur": "~14.1.4",
"expo-constants": "~17.1.6",
"expo-crypto": "~14.1.4",
"expo-dev-client": "~5.1.8",
"expo-font": "~13.3.1",
"expo-haptics": "~14.1.4",
"expo-image-picker": "~16.1.4",
"expo-linear-gradient": "~14.1.4",
"expo-linking": "~7.1.5",
"expo-localization": "~16.1.5",
"expo-location": "~18.1.5",
"expo-router": "~5.0.7",
"expo-splash-screen": "~0.30.8",
"expo-status-bar": "~2.2.3",
"expo-symbols": "~0.4.4",
"expo-system-ui": "~5.0.7",
"expo-updates": "~0.28.13",
"expo-web-browser": "~14.1.6",
"i18next": "^25.0.1",
"jwt-decode": "^4.0.0",
"moment": "^2.30.1",
"react": "19.0.0",
"react-dom": "19.0.0",
"react-i18next": "^15.5.1",
"react-native": "0.79.2",
"react-native-chart-kit": "^6.12.0",
"react-native-gesture-handler": "~2.24.0",
"react-native-maps": "1.20.1",
"react-native-modal": "^14.0.0-rc.1",
"react-native-popup-menu": "^0.16.1",
"react-native-reanimated": "~3.17.4",
"react-native-reanimated-carousel": "^4.0.2",
"react-native-responsive-screen": "^1.4.2",
"react-native-safe-area-context": "5.4.0",
"react-native-screens": "~4.10.0",
"react-native-svg": "15.11.2",
"react-native-web": "^0.20.0",
"react-native-webview": "13.13.5",
"sockjs-client": "^1.6.1",
"zustand": "^5.0.3"
},
"devDependencies": {
"@babel/core": "^7.25.2",
"@types/jest": "^29.5.12",
"@types/react": "~19.0.10",
"@types/sockjs-client": "^1.5.4",
"jest": "^29.2.1",
"jest-expo": "~53.0.5",
"typescript": "^5.3.3"
},
"expo": {
"doctor": {
"reactNativeDirectoryCheck": {
"exclude": [
"react-native-chart-kit",
"react-native-responsive-screen",
"@stomp/stompjs",
"moment",
"sockjs-client",
"i18next",
"jwt-decode"
],
"listUnknownPackages": false
}
}
},
"private": true
}
app.json {
"expo": {
"name": "maurieats",
"slug": "maurieats",
"version": "1.0.0",
"orientation": "portrait",
"icon": "./assets/images/icon.png",
"scheme": "myapp",
"userInterfaceStyle": "automatic",
"newArchEnabled": true,
"ios": {
"supportsTablet": true,
"splash": {
"image": "./assets/images/splash.png",
"resizeMode": "cover",
"backgroundColor": "#ffffff"
}
},
"android": {
"package": "mr.maurieats.maurieats",
"adaptiveIcon": {
"foregroundImage": "./assets/images/adaptive-icon.png",
"backgroundColor": "#ffffff"
},
"splash": {
"image": "./assets/images/splash.png",
"resizeMode": "cover",
"backgroundColor": "#ffffff"
},
"permissions": [
"android.permission.RECORD_AUDIO"
]
},
"web": {
"bundler": "metro",
"output": "static",
"favicon": "./assets/images/favicon.png"
},
"plugins": [
"expo-font",
"expo-image-picker",
"expo-router",
[
"expo-splash-screen",
{
"photosPermission": "The app accesses your photos to let you share them with your friends.",
"image": "./assets/images/splash-icon.png",
"resizeMode": "cover",
"backgroundColor": "#ffffff"
}
],
"expo-localization"
],
"experiments": {
"typedRoutes": true
},
"extra": {
"router": {},
"eas": {
"projectId": "***********************************"
}
}
}
}

[bluram]

Same issue

[KalobTaulien]

I have this problem with the "back icon" on iOS. The functionality is there, but the icon itself is invisible.

The icon displays in Simulator, but not in an actual device.

[kmjnnhyk]

same issue

[fandau1]

I ran into a similar issue — in my case it was caused by setting experiments.baseUrl: "./", which I had enabled for building with Electron.

Solution for me was to remove experiments.baseUrl from app.json file

[roseshukla]

Hi did you figure out the issue?

[cleidson-os]

same issue

[pacehutt]

exactly same issue when upgraded to sdk 53 from 52, has anyone found any solution to this?
@ahmedouvadel

[karimcambridge]

Hi, I'm having this issue on dev client and production in expo sdk 53, even when building locally on mac.

Any ideas?

[hramchandani]

Good day. Was this issue resolved? I am experiencing the same issue.

[cleidson-os]

After installing Expo 53, I installed the icon library in my project with:

npx expo install @expo/vector-icons.

This worked for me.

[iqbaldev46]

Changed to version 14.0.4 from 14.1.0 works for me on SDK 53.

[jamespageced]

I'm still seeing an issue, currently using version 14.1.0 for @expo/vector-icons...

JSX Code

<>
  <Pressable
    style={{
      position: 'absolute',
      top: 40,
      left: 20,
      paddingHorizontal: 16,
      paddingVertical: 8,
      borderWidth: 1,
      borderColor: '#ffffff',
      borderRadius: 4,
      zIndex: 10
    }}
    onPress={handleGoBack}
  >
    <MaterialCommunityIcons name="keyboard-backspace" size={32} color="#ffffff" />
  </Pressable>
  <DataCaptureView style={{ flex: 1 }} context={dataCaptureContext} ref={refView} />
</>

[jamespageced]

I added the following package expo-file-system.

package versions...

"@expo/vector-icons": "^14.1.0"
"expo": "~53.0.24"
"expo-file-system": "~18.1.11"

It works for me now.

[fabiohouse]

I had the same problem with:

• "@expo/vector-icons": "^14.1.0",
• "expo": "~53.0.17",

and I was using 51.xx.

To solve the problem, I added the following:

• "expo-font": "~13.3.2"

which requires:

• "expo-asset": "~11.1.7",

which requires:

• "expo-file-system": "~18.1.11",

I'm hoping for a more optimized solution directly on @expo/vector-icons