วิธีการทำ Multiple Environment บน Project React Native ที่เวอร์ชันต่ำกว่า 0.60 ที่หลายๆคนมองข้ามกัน

ปัญหาคือผมไปเจอหลายๆคนเขียนบทความเรื่องนี้กัน ทั้งของฝรั่งทั้งของคนไทยกันเอง แล้วลืมขั้นตอนบางอย่างไป ทำให้โปรเจ็คเมื่อคนในทีมเอาไปใช้ หรือเมื่อลบ Pods Project แล้ว Install Pods ใหม่แล้ว "พัง"

นั่นก็คือการแก้ไข Podfile ให้ถูกต้อง

เนื่องจาก How-to ของหลายๆเจ้านั้นให้เราทำการ Duplicate Build Target Project ออกมาจาก Target หลัก แล้วทำการเปลี่ยนค่า Config ต่างๆให้ตรงกับ Environment ที่เราต้องการ ถ้าเป็น React native ที่จำเป็นต้องใช้คำสั่ง link แบบ manual อยู่ (เวอร์ชันต่ำกว่า 0.60) จะทำให้พัง! เพราะว่าหา Pods Project ไม่เจอ ให้เราเพิ่มคำสั่งนี้ใน Podfile ครับ

target 'MAIN TARGET' do  
  target 'SUB TARGET 1' do
    inherit! :complete
  end

  target 'SUB TARGET 2' do
    inherit! :complete
  end
 end

ส่วนของ Android ไม่มีปัญหาครับ เพราะไม่จำเป็นต้องแยกโปรเจ็คใหม่ แค่ให้ระวังพวก Package ที่ใช้ อย่างพวก react-native-config มันจะมองหา applicationId ว่าตรงกับที่มันสั่ง link เอาไว้หรือไม่ หากเราไปใส่ applicationIdSuffix เข้าไป อาจจะทำให้ทำงานผิดพลาดได้ ให้ไป config build.gradle ให้ override ค่านี้ ก็ใช้งานได้ละ

สำหรับเวอร์ชัน 0.60 ขึ้นไป มันมี autolink ชีวิตก็จะง่ายขึ้นเยอะ Config นิดเดียวก็ผ่านแบบชิวๆ

target 'MAIN TARGET' do  
  target 'SUB TARGET 1' do
    inherit! :complete
  end

  target 'SUB TARGET 2' do
    inherit! :complete
  end
  use_native_modules!
 end

Reference

React-native link only links to 1st Xcode target · Issue #41 · react-native-community/cli

Migrated from React Native repo facebook/react-native#22162

GitHubreact-native-community

Settings up multiple app targets in React-Native

Settings up multiple app targets in React-Native. GitHub Gist: instantly share code, notes, and snippets.

Gist262588213843476