react native export source map

[zdary]

If you are looking for help, please confirm the following...

• I confirm I have searched the Docs, Codemagic Sample Projects, and GitHub Discussions.
• I confirm the software versions on my local computer match the ones in CI environment (e.g. Xcode version, Gradle version). See here
• I confirm I am able to do a fresh clone of the repository and build the project on my local computer.

Which mobile framework are you using?

React Native

Steps to reproduce

We would like to export source maps of react native project to datadog during codemagic build.

Where do I set --sourcemap-output in the xcode-project build-ipa command?

Currently our command looks like this:

      name: Build ipa for distribution
      script: |
        xcode-project build-ipa \
        --workspace "$CM_BUILD_DIR/ios/$XCODE_WORKSPACE" \
        --scheme "$XCODE_SCHEME" \
        --export-options-plist "$CM_BUILD_DIR/ios/exportOptions.plist"

Expected results

I'd have a handle to source map generated for current build

Actual results

not sure how to generate source map

Build id (optional)

No response

[dtrdic]

hey @zdary the xcode-project build-ipa command does not inherently support generating source maps for a React Native project so you can't put the --sourcemap-output flag there. Source maps are usually generated during the JavaScript bundling step.
You could try something like this;

react-native-ios:
     name: React Native iOS 
     max_build_duration: 120
     instance_type: mac_mini_m1
     integrations:
       app_store_connect: TestAPIkey
     environment:
       ios_signing:
         distribution_type: app_store
         bundle_identifier: io.sample.test
       vars:
         CM_CLONE_DEPTH: 1
         XCODE_WORKSPACE: "Test.xcworkspace" # <-- Put the name of your Xcode workspace here
         XCODE_SCHEME: "Test" # <-- Put the name of your Xcode scheme here
         SOURCE_MAP_PATH: "$CM_BUILD_DIR/source-maps"

     scripts:
         - name: Install npm dependencies
           script: |
             npm install
         - name: npm install -g react-native-cli
           script: |
             npm install -g react-native-cli
         - name: Install CocoaPods dependencies
           script: |
             cd ios && pod install
         - name: Set up code signing settings on Xcode project
           script: |
             xcode-project use-profiles --project ios/*.xcodeproj
         - name: Set Info.plist values
           script: |
             # This allows publishing without manually answering the question about encryption 
             PLIST=$CM_BUILD_DIR/$XCODE_SCHEME/Info.plist
             PLIST_BUDDY=/usr/libexec/PlistBuddy
             $PLIST_BUDDY -c "Add :ITSAppUsesNonExemptEncryption bool false" $PLIST
         - name: Increment build number 
           script: |
             cd $CM_BUILD_DIR/ios
             agvtool new-version -all $(($BUILD_NUMBER + 1))
         - name: create folder
           script: |
             mkdir -p $CM_BUILD_DIR/source-maps
         - name: Generate Source Maps
           script: |
             react-native bundle \
               --platform ios \
               --dev false \
               --entry-file index.js \
               --bundle-output $SOURCE_MAP_PATH/main.jsbundle \
               --sourcemap-output $SOURCE_MAP_PATH/main.jsbundle.map
         - name: Build ipa for distribution and version
           script: |
             xcode-project build-ipa \
               --workspace "$CM_BUILD_DIR/ios/$XCODE_WORKSPACE" \
               --scheme "$XCODE_SCHEME" \
               --archive-flags="-destination 'generic/platform=iOS'"         
     artifacts:
         - build/ios/ipa/*.ipa
         - $HOME/Library/Developer/Xcode/DerivedData/**/Build/**/*.app
         - $CM_BUILD_DIR/source-maps/sourcemaps.json
         - $CM_BUILD_DIR/source-maps/main.jsbundle.map

[icarusdust]

Let David know by replying to this thread if you have any other questions. Closing it for now due to inactivity.