Where to add source map command in Xcode for my production build when adding sourcemap for React Native for Production?

Question

RE (don't have enough experience points to reply there): "In my bundle command for my production build I tell it to generate a source map" How to add sourcemap in React Native for Production?

In Xcode Version 7.3 beta 3, I went to [My Project] > Build Phases > Bundle React Native code and images

Under: export NODE_BINARY=node ../node_modules/react-native/packager/react-native-xcode.sh

I added: cd /Users/andresn/dev/[My Project] react-native bundle --platform ios --entry-file index.ios.js --dev false --bundle-output ./ios/main.jsbundle --assets-dest ./ios --sourcemap-output ./sourcemap.js

Is something like this what he meant, or is there a more proper way of doing this?

Note: you need a semicolon or line break after that first cd: cd /Users/andresn/dev/[My Project]; react-native bundle --platform ios --entry-file index.ios.js --dev false --bundle-output ./ios/main.jsbundle --assets-dest ./ios --sourcemap-output ./sourcemap.js — Andres Narvaez, Mar 15 '16 at 18:05
Hey @Andres Narvaez did you manage to get this to work for you? — Brien Crean, Apr 26 '16 at 22:32
@brien.crean yeah, no problems to date after my last comment. — Andres Narvaez, May 02 '16 at 03:20

score 3 · Answer 1 · edited Nov 22 '17 at 07:50

3

A generic solution based on what you've already said:

export NODE_BINARY=node

if [ "${CONFIGURATION}" = "Release" ]
then
  cd "${PROJECT_DIR}/../"
  react-native bundle --platform ios --entry-file index.ios.js --dev false --bundle-output ./ios/main.jsbundle --assets-dest ./ios --sourcemap-output ./ios/main.jsbundle.map
else
  ../node_modules/react-native/scripts/react-native-xcode.sh
fi

Be sure to add the assets and main.jsbundle.map to your iOS project then create your release build again.

edited Nov 22 '17 at 07:50

Bruno Lemos

8,847
5
40
51

answered Sep 05 '16 at 23:56

Luke Rhodes

293
3
13

I really need to drag all assets to "Copy Bundle Resources"? How does react native do it automatically? – Bruno Lemos Nov 22 '17 at 08:12
Created this: https://gist.github.com/brunolemos/ed81562c90fd4ce6682b6dcf338548ac – Bruno Lemos Nov 22 '17 at 08:24

score 3 · Answer 2 · edited Nov 22 '17 at 07:49

I ended up using the following script in Bundle React Native code and images:

export NODE_BINARY=node
if [ "${CONFIGURATION}" = "Release" ]
then ../sourcemap.sh
else ../node_modules/react-native/scripts/react-native-xcode.sh
fi

Then in the project directory's root, I'm using the following sourcemap.sh script which generates a source map file in the ./ios directory:

#!/bin/bash
$NODE_BINARY ../node_modules/react-native/local-cli/cli.js bundle --platform ios --entry-file ./index.ios.js --dev false --bundle-output ./main.jsbundle --assets-dest ./ --sourcemap-output ./main.jsbundle.map

Where to add source map command in Xcode for my production build when adding sourcemap for React Native for Production?

2 Answers2