Missing Instructions for iOS Source Map Upload in React Native Migration Guide (5.x to 6.x)

[mbellagamba]

SDK

React Native SDK

Description

The current migration guide for upgrading Sentry in React Native projects from version 5.x to 6.x lacks instructions for updating the iOS project configuration related to source map uploads. This omission results in an incomplete migration guide and may lead to broken Release builds for iOS.

The migration guide does not mention the need to update the "Bundle React Native code and images" build phase in the iOS project file to configure automatic source map uploads. This step is critical and is documented in the Manual Configuration section of the Sentry documentation.
Without these changes: debug builds in the iOS simulator function correctly, masking the problem but release archives crash on startup because the JS bundle is not correctly generated.

Suggested Solution

Update the React Native migration guide for version 5.x to 6.x to include clear steps for modifying the "Bundle React Native code and images" build phase, ensuring the necessary changes are included during migration.

[getsantry]

Assigning to @getsentry/support for routing ⏲️

[krystofwoldrich]

Hi @mbellagamba,
thank you for the message,
could you share more details about the crash that you have experienced after migrating to RN SDK v6?

Could you also share the state of the "Bundle React Native code and images" before the upgrade.

[mbellagamba]

Hi @mbellagamba, thank you for the message, could you share more details about the crash that you have experienced after migrating to RN SDK v6?

On production build, the app crashed on startup. When I debugged it the error is something like "main.jsbundle does not exist".

Could you also share the state of the "Bundle React Native code and images" before the upgrade.

My previous version of the shell script "Bundle React Native code and images" is what I've read on the previous version of Sentry Docs.

set -e
export SENTRY_PROPERTIES=sentry.properties
export EXTRA_PACKAGER_ARGS="--sourcemap-output $DERIVED_FILE_DIR/main.jsbundle.map"
WITH_ENVIRONMENT="$REACT_NATIVE_PATH/scripts/xcode/with-environment.sh"
REACT_NATIVE_XCODE="$REACT_NATIVE_PATH/scripts/react-native-xcode.sh"
SENTRY_CLI_PATH="../node_modules/@sentry/cli/bin/sentry-cli"
/bin/sh -c "$WITH_ENVIRONMENT "$SENTRY_CLI_PATH react-native xcode "/bin/sh ../node_modules/@sentry/react-native/scripts/sentry-xcode.sh $REACT_NATIVE_XCODE\""

In particular this update fixed by build.

-shellScript = "set -e\nexport SENTRY_PROPERTIES=sentry.properties\nexport EXTRA_PACKAGER_ARGS=\"--sourcemap-output $DERIVED_FILE_DIR/main.jsbundle.map\"\nWITH_ENVIRONMENT=\"$REACT_NATIVE_PATH/scripts/xcode/with-environment.sh\"\nREACT_NATIVE_XCODE=\"$REACT_NATIVE_PATH/scripts/react-native-xcode.sh\"\nSENTRY_CLI_PATH=\"../node_modules/@sentry/cli/bin/sentry-cli\"\n/bin/sh -c \"$WITH_ENVIRONMENT \\\"$SENTRY_CLI_PATH react-native xcode \\\"/bin/sh ../node_modules/@sentry/react-native/scripts/sentry-xcode.sh $REACT_NATIVE_XCODE\\\"\\\"\"\n";
+shellScript = "set -e\n\nWITH_ENVIRONMENT=\"../node_modules/react-native/scripts/xcode/with-environment.sh\"\nREACT_NATIVE_XCODE=\"../node_modules/react-native/scripts/react-native-xcode.sh\"\nSENTRY_XCODE=\"../node_modules/@sentry/react-native/scripts/sentry-xcode.sh\"\nBUNDLE_REACT_NATIVE=\"/bin/sh $SENTRY_XCODE $REACT_NATIVE_XCODE\"\n/bin/sh -c \"$WITH_ENVIRONMENT \\\"$BUNDLE_REACT_NATIVE\\\"\"\n";

I don't know too much what's happening here, but it seems like the --sourcemap-output option is not correct. Since the Sentry wizard added this script to my app's configuration during the initial setup, I expect the upgrade guide to mention updating it. I wanted to share my experience to improve the docs for this great product and also to help someone else who might be in the same situation as me.

Thanks for your work!

[krystofwoldrich]

Thank you @mbellagamba,
for the details.

I have formated the before and after scripts and I've discovered that the before script was incorrect regardless the SDK version. I'm not sure how that happened.

set -e
-export SENTRY_PROPERTIES=sentry.properties
-export EXTRA_PACKAGER_ARGS="--sourcemap-output $DERIVED_FILE_DIR/main.jsbundle.map"
-WITH_ENVIRONMENT="$REACT_NATIVE_PATH/scripts/xcode/with-environment.sh"
-REACT_NATIVE_XCODE="$REACT_NATIVE_PATH/scripts/react-native-xcode.sh"
+WITH_ENVIRONMENT="../node_modules/react-native/scripts/xcode/with-environment.sh"
+REACT_NATIVE_XCODE="../node_modules/react-native/scripts/react-native-xcode.sh"
-SENTRY_CLI_PATH="../node_modules/@sentry/cli/bin/sentry-cli"
-/bin/sh -c "$WITH_ENVIRONMENT \"$SENTRY_CLI_PATH react-native xcode \"/bin/sh ../node_modules/@sentry/react-native/scripts/sentry-xcode.sh $REACT_NATIVE_XCODE\"\""
+SENTRY_XCODE="../node_modules/@sentry/react-native/scripts/sentry-xcode.sh"
+BUNDLE_REACT_NATIVE="/bin/sh $SENTRY_XCODE $REACT_NATIVE_XCODE"
+/bin/sh -c "$WITH_ENVIRONMENT \"$BUNDLE_REACT_NATIVE\""

Specifically the following part.

# Before incorrect
/bin/sh -c "$WITH_ENVIRONMENT \"$SENTRY_CLI_PATH react-native xcode \"/bin/sh ../node_modules/@sentry/react-native/scripts/sentry-xcode.sh $REACT_NATIVE_XCODE\"\""

# Before correct
/bin/sh -c "$WITH_ENVIRONMENT \"/bin/sh ../node_modules/@sentry/react-native/scripts/sentry-xcode.sh $REACT_NATIVE_XCODE\""