support development of iOS and Android apps simultaneously #4

- remove setting up host from use-figwheel command
- introduce use-android-device command for changing android host. use-android-device command has to be executed only when user changes android device type for development
- change figwheel support functions in user.clj to support multiple builds
- add instructions to README of how to run iOS and Android simulators simultaneously
This commit is contained in:
Artur Girenko 2016-01-24 13:46:34 +01:00
parent b601f62a4f
commit 1b37d60ea0
3 changed files with 63 additions and 22 deletions

View File

@ -30,8 +30,8 @@ Contributions are welcome.
- Works in Android simulator Genymotion (with re-natal use-figwheel -H 10.0.3.2) - Works in Android simulator Genymotion (with re-natal use-figwheel -H 10.0.3.2)
- Works in stock Android emulator (with re-natal use-figwheel -H 10.0.2.2) - Works in stock Android emulator (with re-natal use-figwheel -H 10.0.2.2)
- Figwheel REPL can be started within nREPL - Figwheel REPL can be started within nREPL
- Simultaneous development of iOS and Android apps is supported
- You can reload app any time, no problem. - You can reload app any time, no problem.
- "Debug in Chrome" is not required anymore.
- Custom react-native components are supported (with re-natal use-component <name>) - Custom react-native components are supported (with re-natal use-component <name>)
- Source maps are available when you "Debug in Chrome" - Source maps are available when you "Debug in Chrome"
- Optimizations :simple is used to compile "production" index.ios.js and index.android.js - Optimizations :simple is used to compile "production" index.ios.js and index.android.js
@ -114,7 +114,8 @@ $ react-native run-android
With genymotion Android simulator you have to use IP "10.0.3.2" in urls to refer to your local machine. With genymotion Android simulator you have to use IP "10.0.3.2" in urls to refer to your local machine.
To specify this use: To specify this use:
``` ```
$ re-natal use-figwheel -H 10.0.3.2 $ re-natal use-android-device genymotion
$ re-natal use-figwheel
$ lein figwheel android $ lein figwheel android
``` ```
Start your simulator and deploy your app: Start your simulator and deploy your app:
@ -126,13 +127,29 @@ $ react-native run-android
With stock Android emulator you have to use IP "10.0.2.2" in urls to refer to your local machine. With stock Android emulator you have to use IP "10.0.2.2" in urls to refer to your local machine.
To specify this use: To specify this use:
``` ```
$ re-natal use-figwheel -H 10.0.2.2 $ re-natal use-android-device avd
$ re-natal use-figwheel
$ lein figwheel android $ lein figwheel android
``` ```
Start your simulator and deploy your app: Start your simulator and deploy your app:
``` ```
$ react-native run-android $ react-native run-android
``` ```
#### Swiching between Android devices
If you have to switch from using genymotion to real android device you have to execute `use-android-device`
command and `use-figwheel`:
```
$ re-natal use-android-device <real|genymotion|avd>
$ re-natal use-figwheel
$ lein figwheel android
```
#### Developing iOS and Android apps simultaneously
```
$ re-natal use-figwheel
$ lein figwheel ios android
```
Then start iOS app from xcode, and Android by executing `react-native run-android`
#### Starting Figwheel REPL from nREPL #### Starting Figwheel REPL from nREPL
To start Figwheel within nREPL session: To start Figwheel within nREPL session:
@ -141,11 +158,15 @@ $ lein repl
``` ```
Then in the nREPL prompt type: Then in the nREPL prompt type:
``` ```
user=> (figwheel-ios) user=> (start-figwheel "ios")
``` ```
Or, for Android build type: Or, for Android build type:
``` ```
user=> (figwheel-android) user=> (start-figwheel "android")
```
Or, for both type:
```
user=> (start-figwheel "ios" "android")
``` ```
## REPL ## REPL

View File

@ -120,6 +120,7 @@ generateConfig = (name) ->
log 'Creating Re-Natal config' log 'Creating Re-Natal config'
config = config =
name: name name: name
androidHost: "localhost"
modules: [] modules: []
imageDirs: ["images"] imageDirs: ["images"]
@ -195,6 +196,19 @@ scanImages = (dirs) ->
imgs = imgs.concat(scanImageDir(dir)); imgs = imgs.concat(scanImageDir(dir));
imgs imgs
configureDevHostForAndroidDevice = (deviceType) ->
try
allowedTypes = {'real': 'localhost', 'avd': '10.0.2.2', 'genymotion': '10.0.3.2'}
devHost = allowedTypes[deviceType]
if (! devHost?)
throw new Error "Unknown android device type #{deviceType}, known types are #{Object.keys(allowedTypes)}"
log "Using host '#{devHost}' for android device type '#{deviceType}'"
config = readConfig()
config.androidHost = devHost
writeConfig(config)
catch {message}
logErr message
copyDevEnvironmentFiles = (projNameHyph, projName, devHost) -> copyDevEnvironmentFiles = (projNameHyph, projName, devHost) ->
mkdirSync "env/dev" mkdirSync "env/dev"
mkdirSync "env/dev/env" mkdirSync "env/dev/env"
@ -439,7 +453,7 @@ updateFigwheelUrlForAndroid= (devHost) ->
edit mainAndroidDevPath, [[figwheelUrlRx, "ws://#{devHost}:"]] edit mainAndroidDevPath, [[figwheelUrlRx, "ws://#{devHost}:"]]
generateDevScripts = (devHost) -> generateDevScripts = () ->
try try
config = readConfig() config = readConfig()
projName = config.name projName = config.name
@ -451,14 +465,16 @@ generateDevScripts = (devHost) ->
modulesAndImages = config.modules.concat images; modulesAndImages = config.modules.concat images;
moduleMap = generateRequireModulesCode modulesAndImages moduleMap = generateRequireModulesCode modulesAndImages
androidDevHost = config.androidHost
fs.writeFileSync 'index.ios.js', "#{moduleMap}require('figwheel-bridge').withModules(modules).start('#{projName}','ios','localhost');" fs.writeFileSync 'index.ios.js', "#{moduleMap}require('figwheel-bridge').withModules(modules).start('#{projName}','ios','localhost');"
log 'index.ios.js was regenerated' log 'index.ios.js was regenerated'
fs.writeFileSync 'index.android.js', "#{moduleMap}require('figwheel-bridge').withModules(modules).start('#{projName}','android','#{devHost}');" fs.writeFileSync 'index.android.js', "#{moduleMap}require('figwheel-bridge').withModules(modules).start('#{projName}','android','#{androidDevHost}');"
log 'index.android.js was regenerated' log 'index.android.js was regenerated'
updateFigwheelUrlForAndroid(devHost) updateFigwheelUrlForAndroid(androidDevHost)
log 'Dev server host for iOS: localhost' log 'Dev server host for iOS: localhost'
log 'Dev server host for Android: ' + devHost log 'Dev server host for Android: ' + androidDevHost
catch {message} catch {message}
logErr \ logErr \
@ -487,6 +503,9 @@ doUpgrade = (config) ->
if (!config.imageDirs) if (!config.imageDirs)
config.imageDirs = ["images"] config.imageDirs = ["images"]
if (!config.androidHost)
config.androidHost = "localhost"
writeConfig(config) writeConfig(config)
log 'upgraded .re-natal' log 'upgraded .re-natal'
@ -565,9 +584,13 @@ cli.command 'deps'
cli.command 'use-figwheel' cli.command 'use-figwheel'
.description 'generate index.ios.js and index.android.js for development with figwheel' .description 'generate index.ios.js and index.android.js for development with figwheel'
.option "-H, --host [host or IP address}]", 'specify server host (default localhost)', "localhost" .action () ->
.action (cmd) -> generateDevScripts()
generateDevScripts(cmd.host)
cli.command 'use-android-device <type>'
.description 'sets up the host for android device type: \'real\' - localhost, \'avd\' - 10.0.2.2, \'genymotion\' - 10.0.3.2'
.action (type) ->
configureDevHostForAndroidDevice type
cli.command 'use-component <name>' cli.command 'use-component <name>'
.description 'configures a custom component to work with figwheel. name is the value you pass to (js/require) function.' .description 'configures a custom component to work with figwheel. name is the value you pass to (js/require) function.'

View File

@ -12,18 +12,15 @@
(def cljs-builds (get-in profiles [:dev :cljsbuild :builds])) (def cljs-builds (get-in profiles [:dev :cljsbuild :builds]))
(defn figwheel-ios (defn start-figwheel
"Start figwheel for iOS build" "Start figwheel for one or more builds"
[] [& build-ids]
(ra/start-figwheel! (ra/start-figwheel!
{:build-ids ["ios"] {:build-ids build-ids
:all-builds cljs-builds}) :all-builds cljs-builds})
(ra/cljs-repl)) (ra/cljs-repl))
(defn figwheel-android (defn stop-figwheel
"Start figwheel for Android build" "Stops figwheel"
[] []
(ra/start-figwheel! (ra/stop-figwheel!))
{:build-ids ["android"]
:all-builds cljs-builds})
(ra/cljs-repl))