Post Views: 5,465
สำหรับผู้พัฒนาที่ต้องการพัฒนา Mobile App แต่รู้สึกว่ายังไม่พร้อมศึกษา React Native แบบจริงจัง สามารถใช้งาน Expo Framework โดยสามารถใช้ได้ทั้งในการพัฒนา หรือ Build ขึ้น Store ได้เลยทั้ง iOS/Android ด้วยภาษา JavaScript/TypeScript
โดยวันนี้จะเริ่มด้วยแนะนำวิธีติดตั้ง Tools สำหรับพัฒนาชื่อ Expo CLI ครับ
- Reference : https://docs.expo.io/versions/latest/
- Installation Version
- windows 10 version 1909 64 bit
- npm 12.14.0 LTS
- python 3.8
- Expo SDK 36
- ติดตั้ง Node Js (โหลดติดตั้งแบบ LTS)
https://nodejs.org/en/ - ถ้ามีแจ้งไฟล์ไม่ปลอดภัยกดข้ามไป




- จะมีให้เลือกว่าจะลง Chocolatey หรือเปล่า เพื่อติดตั้ง Module เพิ่มเติม และแนะนำติดตั้ง Node-Gyp ซึ่งจะต้องติดตั้งเองภายหลัง




- ติดตั้ง Python ก่อนติดตั้ง Node-Gyp ผ่าน Windows Store (หลังกด Get ไม่ต้อง Sign In ก็ได้)


- เปิด windows cmd (Run as Administrator หรือไม่ก็เลือก Start->Node.js command prompt)

- ติดตั้ง node-gyp
npm install -g node-gyp

- ติดตั้ง Expo CLI ด้วย npm
npm install -g expo-cli

- ทดสอบสร้างโปรเจ๊คใหม่ดังนี้
expo init



- สั่งรัน Web สำหรับ Debug จะพบว่า Error

- สำหรับ Expo SDK 36 ต้องแก้ \node_modules\metro-config\src\defaults\blacklist.js ดังนี้
var sharedBlacklist = [
/node_modules[\/\\]react[\/\\]dist[\/\\].*/,
/website\ /node_modules\/.*/,
/heapCapture\/bundle\.js/,
/.*\/__tests__\/.*/
];
