Expo build fails in CI but builds locally (babel-preset-expo has been ignored because it contains invalid configuration) - ios

Question

Classic case of it works on my machine. I am building two react-native apps. App A and App B. Both of the applications were bootstrapped using expo.
When I run the command to build either app locally expo build:ios they both build. Yet when I attempt to build the applications in gitlab-ci only application B fails to build with the following message:
[23:07:28] warn Package babel-preset-expo has been ignored because it contains invalid configuration. Reason: Cannot find module 'babel-preset-expo/package.json'
[23:07:28] Require stack:
[23:07:28] - /builds/XXX/application-b/node_modules/react-native/node_modules/#react-native-community/cli/build/tools/config/resolveNodeModuleDir.js
[23:07:28] - /builds/XXX/application-b/node_modules/react-native/node_modules/#react-native-community/cli/build/tools/releaseChecker/index.js
[23:07:28] - /builds/XXX/application-b/node_modules/react-native/node_modules/#react-native-community/cli/build/commands/server/runServer.js
[23:07:28] - /builds/XXX/application-b/node_modules/react-native/node_modules/#react-native-community/cli/build/commands/server/server.js
[23:07:28] - /builds/XXX/application-b/node_modules/react-native/node_modules/#react-native-community/cli/build/commands/index.js
[23:07:28] - /builds/XXX/application-b/node_modules/react-native/node_modules/#react-native-community/cli/build/index.js
[23:07:28] - /builds/XXX/application-b/node_modules/react-native/local-cli/cli.js
[23:07:28]
[23:07:29] Starting Metro Bundler on port 19001.
[23:07:29] debug Watch mode is not supported in this environment
[23:07:29] debug Checking for a newer version of React Native
[23:07:29] debug Current version: 0.61.4
[23:07:29] debug No release cache found
[23:07:29] debug No release cache found
[23:07:29] debug Checking for newer releases on GitHub
[23:07:29] debug No release cache found
[23:07:30] Publishing to channel 'default'...
[23:07:30] debug Saving "6d6386b01438c6ef0acd213d304b5839" to cache
[23:07:30] debug No release cache found
[23:07:30] debug No release cache found
[23:07:30] debug Latest release: 0.60.0
[23:07:32] Building iOS bundle
[23:07:43] node_modules/expo/AppEntry.js: Cannot find module 'babel-preset-expo' from '/builds/XXX/application-b'
[23:07:43] › Closing Expo server
[23:07:43] node_modules/expo/AppEntry.js: Cannot find module 'babel-preset-expo' from '/builds/XXX/application-b'
[23:07:43] Failed building JavaScript bundle.
[23:07:43] ::ffff:127.0.0.1 - - [06/Apr/2020:23:07:43 +0000] "GET /node_modules/expo/AppEntry.bundle?dev=false&minify=true&hot=false&platform=ios HTTP/1.1" 500 - "-" "axios/0.19.0"
[23:07:43] › Stopping Metro bundler
[23:07:43] Packager URL http://127.0.0.1:19001/node_modules/expo/AppEntry.bundle?dev=false&minify=true&hot=false&platform=ios returned unexpected code 500. Please open your project in the Expo app and see if there are any errors. Also scroll up and make sure there were no errors or warnings when opening your project.
I have tried having the CI explicitly install the module babel-preset-expo, but that does not fix the issue. My babel.config.js is identical for both apps and looks like this:
module.exports = function(api) {
api.cache(true);
return {
presets: ['babel-preset-expo'],
};
};
I have the following lines in my both of my package.json:
"devDependencies": {
"#babel/core": "^7.0.0",
"babel-preset-expo": "^8.0.0"
},
The file in both applications being referenced in the error AppEntry.js is identical as well.
Here is my gitlab-ci.yml:
image: node/alpine
cache:
key: ${CI_COMMIT_REF_SLUG}
paths:
- ~/.npm
stages:
- deploy
- tag
before_script:
- echo $CI_BUILD_REF
- echo $CI_PROJECT_DIR
- apk add --no-cache bash build-base gcc git python3 curl
- PATCH=`git log --pretty=oneline | wc -l | sed -e 's/^[[:space:]]*//'`
- VERSION=`cat VERSION`
- VERSION=${VERSION%?}
- TAG="${VERSION}${PATCH}"
- echo "Build version = ${TAG}"
expo-build:
stage: deploy
artifacts:
paths:
- ipas/
script:
- sed -i "s/0.0.0/${TAG}/g" app.json
- npm ci --production --cache .npm --prefer-offline
- npx expo login -u $EXPO_USERNAME -p $EXPO_PASSWORD
- EXPO_DEBUG=true npx expo build:ios --non-interactive # This works because it has been already built once through the cli, credentials cannot be pass into env
- mkdir -p ipas
- curl "$(npx expo url:ipa --non-interactive)" -o ipas/bravo-teller-$TAG.ipa
only:
- master
Any feedback or suggestions as to what this could be would be greatly appreciated. Thanks

Answer 1

Actually, the babel-preset-expo is not a devDependencies you should add it to dependencies furthermore likely you should use lazy load by using the following code on your babel configuration:
[
'babel-preset-expo',
{
lazyImports: true,
},
]