利用 Create React Native App 快速創建 React Native 應用

本文介紹的 Create-React-Native-App 是非常 Awesome 的工具，而其背后的 Expo 整個平台也讓筆者感覺非常的不錯。筆者目前公司是采用 APICloud 進行移動應用開發（人少 + 應用要求低），不過確實也有很多的性能瓶頸；今天筆者還特地郵件問了 Expo Support 有關添加微信、百度地圖等成為官方預置庫的計划，得到的回復是可能兩三個月內會先將微信集成進來，很期待未來 Expo 在國內的發展。

利用 Create React Native App 快速創建 React Native 應用

Create React Native App 是由 Facebook 與 Expo 聯合開發的用於快速創建 React Native 應用的工具，其深受我們在前文介紹的 Create React App 的影響。 很多沒有移動端開發經驗的 Web 開發者在初次嘗試 React Native 應用開發時可能會困擾於大量的原生依賴與開發環境，特別對於 Android 開發者而言。而 Create React Native App 則能夠讓用戶在未安裝 Xcode 或者 Android Studio 時，即使是在 Linux 或者 Windows 環境下也能開始 React Native 的開發與調試。這一點主要基於我們可以選擇將應用運行在 Expo 的客戶端應用內，該應用能夠加載遠端的純粹的 JavaScript 代碼而不用進行任何的原生代碼編譯操作。我們可以使用 NPM 快速安裝命令行工具：

$ npm i -g create-react-native-app
$ create-react-native-app my-project
$ cd my-project
$ npm start

命令行中會輸出如下界面，我們可以在 Expo 移動端應用中掃描二維碼，即可以開始遠程調試：

我們也可以選擇使用 Expo 的桌面端輔助開發工具 XDE ，其內置了命令行工具與發布工具，同時支持使用內部模擬器：

除此之外，Expo 還提供了 Sketch 這個在線編輯器，提供了組件拖拽、內建的 ESLint 等功能，允許開發者直接在網頁中進行快速開發與共享，然后通過二維碼在應用內預覽。

Expo 支持標准的 React Native 組件，目前已經內置了相機、視頻、通訊錄等等常用的系統 API，並且預置了 Airbnb react-native-maps、 Facebook authentication 等優秀的工具庫，未來也在逐步將常用的微信、百度地圖等依賴作為預置納入到 SDK 中。我們也可以使用 npm run eject 來將其恢復為類似於 react-native init 創建的包含原生代碼的初始化項目，這樣我們就能夠自由地添加原生模塊。我們也可以使用 Expo 提供的 exp 命令行將項目編譯為獨立可發布的應用。我們需要使用 npm install -g exp 安裝命令行工具，然后配置 exp.json 文件：

{
   name: "Playground",
   icon: "https://s3.amazonaws.com/exp-us-standard/rnplay/app-icon.png",
   version: "2.0.0",
   slug: "rnplay",
   sdkVersion: "8.0.0",
   ios: {
     bundleIdentifier: "org.rnplay.exp",
   },
   android: {
     package: "org.rnplay.exp",
   }
 }

配置完畢之后在應用目錄內使用 exp start 命令來啟動 Expo 打包工具，然后選擇使用 exp build:android 或者 exp build:ios 分別構建 Android 或者 iOS 獨立應用。