EAS build for production fails due to some PNG errors in gradle.

[krishnakant]

I have been getting the gradle error related to some PNG, while trying to get a production build. I have checked all the images used in the project are already PNG.

Below is a small snippet of error message while trying to run " eas build --profile production" :

Project details :

• Expo managed workflow
• eas-cli version used : eas-cli/0.47.0
• I even tried lowering the SDK version to SDK 43, but it didn’t help.

My package.json :

"dependencies": {
    "@react-native-async-storage/async-storage": "~1.15.0",
    "@react-native-community/masked-view": "0.1.10",
    "@react-native-community/slider": "4.1.12",
    "@react-navigation/bottom-tabs": "^5.11.11",
    "@react-navigation/native": "^5.9.4",
    "@react-navigation/stack": "^5.14.5",
    "expo": "^43.0.0",
    "expo-av": "~10.1.3",
    "expo-dev-client": "~0.6.3",
    "expo-file-system": "~13.0.3",
    "expo-media-library": "~13.0.3",
    "expo-permissions": "~13.0.3",
    "expo-sharing": "~10.0.3",
    "expo-splash-screen": "~0.13.5",
    "expo-status-bar": "~1.1.0",
    "expo-system-ui": "~1.0.0",
    "expo-updates": "~0.10.13",
    "react": "17.0.1",
    "react-dom": "17.0.1",
    "react-native": "0.64.3",
    "react-native-animatable": "^1.3.3",
    "react-native-gesture-handler": "~1.10.2",
    "react-native-music-control": "^1.4.0",
    "react-native-reanimated": "2.2.0",
    "react-native-safe-area-context": "3.3.2",
    "react-native-screens": "~3.8.0",
    "react-native-web": "0.17.1",
    "recyclerlistview": "^3.0.5"
  },

My eas.json :

{
  "cli": {
    "version": ">= 0.47.0"
  },
  "build": {
    "development": {
      "developmentClient": true,
      "distribution": "internal"
    },
    "preview": {
      "distribution": "internal"
    },
    "production": {}
  },
  "submit": {
    "production": {}
  }
}

Please let me know, how can I fix this problem asap. It’s been 2-3 weeks we’re trying to resolve it.

[wkozyra]

how did you check the type? Most likely you have some jpeg there with the name .png

To verify what exactly is causing issue, you can use expo build:inspect --stage pre-build command and check that specific file from error

[krishnakant]

I checked the image type in properties. Also, if you notice in the image, I have already kept “File name extension” ON :

Also, while trying to run command “expo build:inspect --stage pre-build” , it gives the below response:
“build:inspect” is not an expo command. See “expo --help” for the full list of commands.

[wkozyra]

sorry it’s eas build:inspect (but you will need to run it under WSL if it’s on windows)

I don’t how windows it’s verifying it, but likely it’s just based on name. If you have WSL installed you can run file ./pathtofile.png to check it

[wodin]

For a quick’n’dirty way to check if it’s a PNG you can do something like this:

assets$ node
Welcome to Node.js v16.13.2.
Type ".help" for more information.
> fs.readFileSync("icon.png").slice(1,4).toString()
'PNG'
> 

EDIT: But if it’s not a PNG, file should tell you what it is.

[krishnakant]

Hey, it was actually the images problem. Though it showed “PNG” as type in Windows, later while checking the type online, some file turned out to be a “JPEG”. I converted them to PNG via online convertor.
This time I was able to get the production build.

To check file type : https://www.checkfiletype.com/
To convert files : https://jpg2png.com/

Thanks team!