Environment:
xCode 12
react-native-cli: 2.0.1
react-native: 0.63.4
Hi! I'm trying release build with react native bare workflow.
Debug build was no problem, But after implementing release build, my app doesn't show any images form assets directory.
Xcode log is like this.
> [native] Could not find image
file:///var/mobile/Containers/Data/Application/610F6543-2E6A-404E-8D54-6506084093DE/Library/Application%20Support/.expo-internal/assets/assets/icon_password.png
I tried ways below URl, but I coudn't solove the problem after all.
react-native iOS app not showing static assets (images) after deploying
Please give me your knowlege...:/
I faced this problem too.
My steps to solve the problem were:
execute react-native bundle --entry-file ./index.js --platform ios --bundle-output ios/main.jsbundle --assets-dest ios
This command, among other things, creates main.jsbundle file and assets folder in ios directory
Add "main.jsbundle" and "assets" folder to 'Copy Bundle Resources'.
Rebuild project.
p.s This post helped me a lot https://stackoverflow.com/a/35366243
Hope these steps help you!
"react": "16.13.1",
"react-native": "0.63.0",
Encountered the below main.jsbundle does not exist. This must be a bug with issue when trying to archive after upgrading to react-native 0.63. was wondering if anyone encounters the same issue
This worked for me in a project involving babel-plugin-module-resolver:
Open your ios/*.xcworkspace in Xcode.
Click on the name of your project in the project navigator.
Click on the name of your target in the pane on the left.
Click on Build Phases.
Expand the Bundle React Native code and images phase.
On the first line of the script, add cd $PROJECT_DIR/.. to go up a directory.
The whole script should look like this:
cd $PROJECT_DIR/..
export NODE_BINARY=node
./node_modules/react-native/scripts/react-native-xcode.sh
Note that this might break if the source of this is a bug in 0.63.0, so you may need to undo this on a future release.
Props to #typester for bringing this up on facebook/react-native #29351.
Found a solution
In Xcode Build Phases -> Copy Bundle Resources, add main.jsbundle
In package.json, add
"scripts": {
"bundle:ios": "react-native bundle --entry-file index.ios.js --platform ios --dev false --bundle-output ios/main.jsbundle --assets-dest ios",
"postinstall": "yarn run bundle:ios"
...
},
so the main.jsbundle will be generated
For me the error occurred because I had imports like this:
import Component from '..';
Replacing those with relative paths (#components/path/to/component) fixed the issue.
Not sure why resolving these paths is problematic now.
I dug into the node_modules/react-native/node_modules/#react-native-community/cli/build/commands/bundle/buildBundle.js and placed a catch block in the buildBundle function in order to see the component(s) with the problematic import.
I think #changey's solution also works, it only requires adding an additional build step in the CI.
Change your babel.config.js to .babelrc.js and it will work
None of the above fixed it for me, but it works with this PR, it'll probably be released soon https://github.com/facebook/react-native/pull/29477
Just in case somebody finds it useful :)
I upgraded from 0.62.5 to 0.63 and encountered the same error.
In my case, I found out the react-native-xcode.sh script executed in the "Bundle React Native code and images" build phase passed the wrong entry file (index.js) to the build command when it should have used index.ios.js. Not sure exactly why this changed in 0.63.
A solution that worked for me was specifying the correct entry file when running the script:
In Xcode, go to Build Phases -> Bundle React Native code and images
Change this part of the script
../node_modules/react-native/scripts/react-native-xcode.sh to ENTRY_FILE=index.ios.js ../node_modules/react-native/scripts/react-native-xcode.sh
Seen similar issue with RN v0.63. Looking at the error logs noticed that the was an issue with Node memory out of range (EG failed to build bundle). I fixed this by adding:
export NODE_OPTIONS=--max_old_space_size=1024
to Bundle React Native code and images phase script
EG:
export NODE_BINARY=node
export NODE_OPTIONS=--max_old_space_size=1024
../node_modules/react-native/scripts/react-native-xcode.sh
if you use M1'series Mac, you can try below.
select Xcode Build Phases tab
expand the Bundle React Native code and images phase
change script like below
cd $PROJECT_DIR/..
export NODE_BINARY=/opt/homebrew/bin/node
./node_modules/react-native/scripts/react-native-xcode.sh
If you have a non-standard Node.js installation, select your project in Xcode, find 'Build Phases' - 'Bundle React Native code and images' and change NODE_BINARY to an absolute path to your node executable. You can find it by invoking 'which node' in the terminal.
As I ran yarn bundle-ios, the following message showed up.
Unable to resolve module config/dimension from src/scenes/Home/index.js: config/dimension could not be found within the project.
I've been using react-native-module-resolver。 I configed "#configs" for path alias。 As you can see above the # is missing。
Corrected it, main.jsbundle was created, finally。
This is a known issue (https://github.com/facebook/react-native/commit/83777cb4fb5dda89c430b7eff9cd1f28d2577831), and is fixed in 0.63.3 https://github.com/react-native-community/releases/blob/master/CHANGELOG.md#v0633
Just update to ^0.63.3 and you'll be good.
For me, I had .babelrc and babel.config.js files in the same project. So RN could not find certain imported libraries. So l modified my .babelrc this way:
{
"extends": "./babel.config.js",
"plugins": [ //bla bla
],
}
this was how the error stopped for me.
This error is specific to the architecture settings of the Xcode project itself. When the wrong arch is set, you'll receive this error because the bundle failed to build.
Here is an updated answer for anyone receiving this error on Xcode 12.5+
Remove Cache, Reinstall Libraries, and Update Pods
Sometimes this error is purely due to cache referencing a different architecture. Use the react-native-clean-project utility to reset all cache related to the project, reinstall packages, and updates pods. This usually clears up the majority of my missing bundle errors.
Verify Xcode Build Settings (Xcode 12.5+ on x86_64)
For Production: you only need to make sure the Architectures settings set to Standard Architectures (default ${ARCHS_STANDARD}). Excluded Architectures should be empty, and if VALID_ARCHS exists, be sure to rename it, then click Archive.
Simulator: You still need to add the VALID_ARCHS variable for the simulator, but set it to the project's workspace, setting the value to x86_64. In order to keep it a single setting for the entire project, make sure VALID_ARCHS isn't already set in Pods project or the App project. If it is, remove the variable, and then set the value on the workspace. Click Run to start your simulation build.
Now when you need to build for production, simply rename VALID_ARCHS to SIM_VALID_ARCHS, and then Archive. 🎉
For those using expo eas build, I was having this same error after upgrading react-native and expo SDK. I fix it using changey solution by adding following to a script called by the hook eas-build-post-install:
if [[ "$EAS_BUILD_PLATFORM" == "ios" ]]; then
echo "Creating main.jsbundle required during build process"
react-native bundle --entry-file='index.js' --bundle-output='./ios/YOURPROJECTNAME/main.jsbundle' --dev=false --platform='ios' --assets-dest='./ios'
fi
I've looked high and low at solutions to this problem, but none of them have worked.
on iOS, I'm making a release bundle with react-native bundle --dev false --assets-dest ./ios/Bundle --entry-file index.js --platform ios --bundle-output ./ios/Bundle/main.jsbundle
Afterwards, I'm adding the Bundle directory which includes the assets directory and the main.jsbundle to my project in XCode.
Then I change the Run scheme to work on the Release configuration, and run the project on a physical device.
React Native finds the bundle, but none of the static assets show up.
I'm on React Native 0.48
Incase anyone else has a similar problem and needs some ideas where to look..
Check your xcode build logs and to see where your bundle is being created
probably something like
/Users/johnsmith/Library/Developer/Xcode/DerivedData/MyApp-asde14dwefda878/Build/Products/Release-iphonesimulator/MyApp.app
Inspect and make sure that main.jsbundle and assets/ are both at the top level.
If they're not then check your arguments to the bundle command (called by the bundle react native code and images build phase by the react-native-xcode.sh command) the defaults should be fine. you can also use set -x to print out more info about what's being called, or click show environment variables in build log
Assuming that everything is in the correct location...then try looking where the code is really looking for the image
import background from "../../assets/background.png"
alert(Image.resolveAssetSource(background).uri);
Inspect in file explorer and see if you can find the file. The folder my code was looking in was this:
/Users/.../Library/Developer/CoreSimulator/Devices/718SDF9995-1123D6-46A8-93DD-830963FC4372/data/Containers/Data/Application/25C8SG9C-2CSA-4891-BDFD-B6B37A3B4022/Library/Application Support/.expo-internal/
In my case I had ejected from expo and the file was there under a hash but the code was looking for it as ../assets/background.png It was using expo-asset to resolve the file in release (not metro as in debug), the fix was to add
../node_modules/expo-updates/scripts/create-manifest-ios.sh
to the end of the Bundle React Native code and images build phase and to add
import 'expo-updates'
to the top of my App.tsx file
Another idea would be to add an external image and see if it can load that.
source={{uri:'https://......../...png'}}
There's also the problem with Ios14 images that can be fixed by updating react-native or using npx react-native-fix-image but that would also affect dev builds
I'm building a react native project and I got this error on running.
Can you please help me to resolve this issue?
This happened to me because I ran react-native run-ios immediately after installing code-push. It turns out that I needed to run pod install in my ios directory, then clean and rebuild to make this work.
I resolved it following steps below.
Create account on code-push(microsoft.github.io/code-push) and register into collaborator on existing app.
Run code-push app ls on terminal and see if registered successfully.
Run code-push deployment ls "appname" -k on terminal to get deployment keys.
Run react-native link and enter the keys on prompt.
I met the same issue as described in this problem. I tried both answers, but neither worked. After being stuck by a codePush undefined problem, I figured out that it's my fault. I missed a important step in CodePush readme tutorial: iOS setup:
After pod install and updating info.list, undefined codePush disappeared and everything worked well.
I had a old React-Native project which I wanted to give it a try again and when trying to run the project on iOS (Android works perfect) I get the error that Debug-iphonesimulator/GeneratedInfoPlistDotEnv.h file not found.
If I run the project from the command react-native run-ios, than the build will succeed.
What can cause this issue and how can it be fixed?
I have tried to fix it with the comments from this issue but no success.
React-Native verision: 0.47
Full error:
<built-in>:1:10: fatal error:
'/Users/myUser/Library/Developer/Xcode/DerivedData/Project-gcaxrvbcwgkfhkadevoqxcprxszw/Build/Products/Debug-iphonesimulator/GeneratedInfoPlistDotEnv.h' file not found
I fixed by copying file GeneratedInfoPlistDotEnv.h (in /ios/build/Build/Products/) to the path mentioned in the error message.
The path mentioned in error message for simulator is not same as real phone, you need to copy for a second time.
The development for React Native just like droped in a deep black hole, what you need to do is just climb and climb and climb...
Changing the Info.plist preprocessor prefix file to works for me ${CONFIGURATION_BUILD_DIR}/../GeneratedInfoPlistDotEnv.h
Image of code in Xcode 9
If you're coming from React version 0.60 and above, you should be referencing the package from GitHub instead of NPM. The author hasn't released auto-linking support on NPM yet, even though it's already merged!?
Try these steps after you unlink and uninstall the existing version of react-native-config. Remember to revert to default Info.plist preprocessor settings in XCode build settings.
yarn add https://github.com/luggit/react-native-config.git
cd ios && pod install
You don't have to add any other post-install scripts, just run the app like usual and it should work fine. Make sure you undo any other fixes before doing this.