Improving the development environment for react-native

React Native Meetup #12 @Online
https://react-native-meetup.connpass.com/event/210587/

いいかんじにバージョンアゲアゲくん
https://gist.github.com/mrtry/8bd873f3f4629692d698c3c1f318b560

release後処理くん
https://gist.github.com/mrtry/52fe8a60e3e4fe81f5455e9d728281e3

よしなにnpm installするくん
https://gist.github.com/mrtry/6a624966e536299e9ca9157ed89cad7d

.xcode-versionと一致してるかをチェックするスクリプト
https://gist.github.com/mrtry/5c30b67d0dbb6342550399c61a34219f

Transcript

1. DXΛόΫ্͛͢ΔͨΊʹ 
 ͍Ζ͍Ζ΍ͬͨ͜ͱ mrtry 2021/05/21
2. ࣗݾ঺հ • ͱΒ͍(@mrtry) • Yamamoto Shinnosuke • v0.56.0͙Β͍͔Β৮ͬͯΔ(4೥ੜ) • AndroidΤϯδχΞͱReact NativeΤϯδχΞΛߦ͖དྷͯ͠Δ
4. ͋Β͢͡ • ΞϓϦ಺੡Ϛϯͱͯ͠࠷ۙೖࣾ🥳 • ৭ʑͱ։ൃ؀ڥ͕੔ͬͯͳ͍😇 • DXΛόΫ্͍͖͍͛ͯͨ͠💪
5. DXΛόΫ্͍͖͍͛ͯͨ͠🤞 ͦΕͧΕGistʹࡌͤͯ·͢🥳 • releaseޙॲཧ͘Μ • Α͠ͳʹnpm install͢Δ͘Μ • ͍͍͔Μ͡ʹόʔδϣϯΞήΞή͘Μ • ֤छπʔϧͷόʔδϣϯݻఆ(node/npmɺXcodeɺfastlane)
6. releaseޙॲཧ͘Μ
7. releaseޙॲཧ͘Μ ϦϦʔεޙʹ΍Δޙॲཧ͕໘౗ 😇 (git fl owӡ༻) • tagଧͪ • masterʹmerge • developͷࠩ෼͋Ε͹औΓࠐΜͰɺdevelop΁merge
8. releaseޙॲཧ͘Μ ϦϦʔεޙʹ΍Δޙॲཧ͕໘౗ 😇 (git fl owӡ༻) • tagଧͪ ← ࣗಈԽͰ΍ͬͯ΄͍͠ • masterʹmerge ← ࣗಈԽͰ΍ͬͯ΄͍͠ • developͷࠩ෼͋Ε͹औΓࠐΜͰɺdevelop΁merge
9. releaseޙॲཧ͘Μ GitHub ActionͰࣗಈԽͨ͠🥳 ϦϦʔε͕ऴΘͬͨλΠϛϯάͰPRΛ࡞Δͱɺ PR࡞੒ۦಈͰrelease/x.x.xͷcommit಺༰ͰҎԼΛ࣮ߦ͢Δ x.x.x ͷλάΛଧͭ commitΛmasterʹ൓ө͢Δ
10. releaseޙॲཧ͘Μ jobs: create-tag: steps: - name: Create tag id: create_tag run: | tag=$( release branch͔Βx.x.xൈ͍ͯ͘Δ ) - uses: actions/checkout@v2 - run: | git tag ${{ tag }} git push origin ${{ tag } } merge-to-master: steps: - uses: mtanzi/action-automerge@v1 with: github_token: ${{ github.token }} source: ${{ release branch }} target: 'master λάͱmaster൓ө͕ࣗಈͰ͞ΕΔ ͋ͱ͸ɺdevelop෼Λmergeͯ͠ऴΘΓ🥳
11. Α͠ͳʹ npm install͢Δ͘Μ
12. Α͠ͳʹnpm install͢Δ͘Μ npm͠๨Ε͕ͪ໰୊ɺ͋Δͱ͓΋͍·͢ 😇 • ϦϑΝΫλ͍ͯ͠Δͱ΍Γ͕ͪ😇 • ৽نػೳ࣮૷͍ͯ͠Δͱ΍Γ͕ͪ😇 • ʮcheckout͚ͨ͠Ͳɺಈ͔ͳ͍…ʯͱ΍Γ͕ͪ😇 BranchҠಈͨ͠λΠϛϯάͰɺnpm iͯ͠΄͍͠😭
13. Α͠ͳʹnpm install͢Δ͘Μ huskyΛಋೖ🐶 • GitͷΠϕϯτۦಈͰεΫϦϓτΛ࣮ߦͰ͖ΔΑ͏ʹ͢Δ͘Μ git checkoutͷλΠϛϯάͰεΫϦϓτΛ࣮ߦ͢Δ🤟 • git checkoutલޙͷpackage.jsonͷhashΛऔಘ • ࠩ෼͕͋ͬͨΒnpm i͢Δ
14. Α͠ͳʹnpm install͢Δ͘Μ prevPackageHash=$(Ҡಈલͷpackage.jsonͷhash ) nextPackageHash=$(Ҡಈޙͷpackage.jsonͷhash) if [ "$prevPackageHash" != "$nextPackageHash" ]; then npm i els e echo "post-checkout: do nothing " f i npm i͠๨ΕʹΑΔʮͳΜ͔ಈ͔ͳ͍ʯ͕ղফ͞Εͨ🥳
15. ͍͍͔Μ͡ʹ ΞϓϦͷόʔδϣϯ ΞήΞή͘Μ
16. ͍͍͔Μ͡ʹόʔδϣϯΞήΞή͘Μ ϦϦʔεલͷόʔδϣϯߋ৽͕໘౗🤮 • JavaScript (package.json / package-lock.json) • Android (build.gradle) • iOS (Xcode) ίϚϯυҰൃΩϝͨΒͦΕͧΕΑ͠ͳʹߋ৽͞Εͯ΄͍͠😭
17. ͍͍͔Μ͡ʹόʔδϣϯΞήΞή͘Μ Release branchͷόʔδϣϯΛ൓ө͢ΔεΫϦϓτΛ࡞Δ JavaScript • npmʹόʔδϣϯߋ৽ػೳ͋ΔͷͰ࢖͏ Android, iOS • Fastlaneʹόʔδϣϯߋ৽ϓϥάΠϯ͕͋ΔͷͰ࢖͏
18. ͍͍͔Μ͡ʹ όʔδϣϯ ΞήΞή͘Μ # package.json·ΘΓΛߋ৽ npm --no-git-tag-version version $versionName # iOS fastlane run increment_build_number fastlane run increment_version_number $versionName # Android fastlane run increment_version_code fastlane run increment_version_name $versionName # diffΛ֬ೝ git add -u git diff --cached ͜ΕΛΩϝΕ͹ղܾ🤟 Android͸Plugin࢖ͬͯΔ
19. ֤छπʔϧͷόʔδϣϯݻఆ
20. ֤छπʔϧͷόʔδϣϯݻఆ ։ൃ࣌ͷπʔϧଟ͗͢໰୊ɺ͋Δͱࢥ͍·͢ ؀ڥߏஙͰࣄނΔཁҼNo.1 (ಠஅͱภݟ) ʮͳʹ͔͠Βͷπʔϧ͕όʔδϣϯζϨͯͯಈ͔ͳ͍ʯ ͭΒ͍ͷͰɺͦΖ͓͖͍͑ͯͨ
21. ֤छπʔϧͷόʔδϣϯݻఆ ͦΕͧΕͷόʔδϣϯΛݻఆ & ࣮ߦ࣌νΣοΫͯ͠ἧ͍͑ͨ • npm/node • Xcode • fastlane • (Android·ΘΓ͸ͦΜͳʹࠔΒͳ͍ؾ͕͢Δ)
22. ֤छπʔϧͷόʔδϣϯݻఆ(npm/node) { ... "engines": { "node": "14.16.1", "npm": "6.14.12" }, ... } nvmͰόʔδϣϯἧ͑ͨ .npmrc Ͱ engine-strict=true ͯ͠ɺ࣮ߦ࣌νΣοΫ͔͚ͨ
23. ֤छπʔϧͷόʔδϣϯݻఆ(Xcode) # Project rootʹҠಈ cd $(git rev-parse --show-toplevel) # όʔδϣϯνΣοΫ if [ "$(cat .xcode-version)" != "$(xcodebuild -version | awk 'NR==1{print $2}')" ]; then echo 'Invalid Xcode version' exit 1 fi xcode-install (gem) Λಋೖͨ͠ ҎԼͷεΫϦϓτͰɺϏϧυ࣌ʹνΣοΫ͔͚ͨ
24. ֤छπʔϧͷόʔδϣϯݻఆ(fastlane) # `fastlane-version` ͱͯ͠Project rootʹఆٛ
 gem 'fastlane', ‘2.183.2 ' 
 # `android/` `ios/` ҎԼͷGemfileʹҎԼΛ௥Ճ
 # `fastlane-version` ΛಡΈࠐΜͰόʔδϣϯΛἧ͑Δ fastlaneVersion = File.join(File.dirname(__FILE__), '../fastlane-version') eval_gemfile(fastlaneVersion) if File.exist?(fastlaneVersion ) fastlaneͷPluginͷॻ͖ํΛࢀߟʹͨ͠
25. \ we are hiring / ʮ׬ʯ