使用react-native （“omnibar”和WebView ）建立的行動網頁瀏覽器的非常粗略的草圖。瀏覽器與網關 API（我最終也可能將其發佈在 GitHub 上）交互，充當（目前不受支援的）去中心化協定（目前為DAT ）的傳輸。
const express = require ( 'express' )
const app = express ( )
const port = 3000
const host = 'localhost'
const startUpMsg = `proxy listening on port ${ port } !`
const serveIndex = require ( 'serve-index' )
const Dat = require ( 'dat-node' )
const path = require ( 'path' )
app . use ( express . static ( __dirname + '/dats' ) )
app . use ( '/' , serveIndex ( __dirname + '/dats' ) )
app . use ( function ( req , res , next ) {
const orig = req . url
const { referer , host } = req . headers
if ( referer && / ^(/) / . test ( req . url ) ) {
// account for relative asset paths
const folder = referer . replace ( `http:// ${ host } /` , '' )
res . redirect ( `/ ${ folder . replace ( '/' , '' ) } ${ req . url } ` )
}
next ( )
} )
app . get ( '/dat/:key' , ( req , res ) => {
const { key } = req . params
Dat ( `./dats/ ${ key } ` , {
key : key
} , function ( err , dat ) {
if ( err ) throw err
dat . joinNetwork ( { } , _ => {
res . json ( {
url : `http:// ${ host } : ${ port } / ${ key } `
} )
} )
} )
} )
app . listen ( port , _ => console . log ( startUpMsg ) )這個專案是透過 Create React Native App 啟動的。
您將在下面找到有關執行常見任務的資訊。本指南的最新版本可在此處取得。
您應該只需要很少更新create-react-native-app的全域安裝，最好從不更新。
更新應用程式的react-native-scripts依賴項應該像增加package.json中的版本號並重新安裝專案的依賴項一樣簡單。
升級到新版本的React Native需要更新react-native 、 react和expo套件版本，並在app.json中設定正確的sdkVersion 。有關軟體包版本相容性的最新信息，請參閱版本控制指南。
如果在專案初始化時安裝了 Yarn，那麼依賴項將透過 Yarn 安裝，您可能也應該使用它來執行這些命令。與相依性安裝不同，在撰寫本文時，Yarn 和 NPM 的命令運行語法是相同的。
npm start在開發模式下運行您的應用程式。
在手機上的 Expo 應用程式中打開它即可查看。如果您儲存對檔案的編輯，它將重新加載，並且您將在終端中看到建置錯誤和日誌。
有時您可能需要重置或清除 React Native 打包器的快取。為此，您可以將--reset-cache標誌傳遞給啟動腳本：
npm start --reset-cache
# or
yarn start --reset-cache
npm test在您的測試中執行 jest 測試運行程式。
npm run ios與npm start類似，但如果您使用的是 Mac 並安裝了它，也會嘗試在 iOS 模擬器中開啟您的應用程式。
npm run android與npm start類似，但也會嘗試在連接的 Android 裝置或模擬器上開啟您的應用程式。需要安裝 Android 建置工具（有關詳細設置，請參閱 React Native 文件）。我們也建議安裝 Genymotion 作為您的 Android 模擬器。完成本機構建環境的設定後，有兩個選項可以讓正確的adb副本可用於 Create React Native App：
adbSettings -> ADB 。選擇「使用自訂 Android SDK 工具」並更新您的 Android SDK 目錄。 adb/Applications/Genymotion.app/Contents/MacOS/tools/ 。npm run eject這將啟動從 Create React Native App 的建置腳本中「彈出」的過程。系統會詢問您幾個關於您希望如何建立專案的問題。
警告：運行彈出是一個永久操作（除了您使用的任何版本控制系統之外）。彈出的應用程式將要求您設定 Xcode 和/或 Android Studio 環境。
您可以編輯app.json以在expo鍵下包含配置鍵。
若要變更應用程式的顯示名稱，請將app.json中的expo.name鍵設定為適當的字串。
若要設定應用程式圖標，請將app.json中的expo.icon鍵設定為本機路徑或 URL。建議您使用具有透明度的 512x512 png 檔案。
此項目設定為使用 jest 進行測試。您可以設定任何您喜歡的測試策略，但 jest 是開箱即用的。在名為__tests__的目錄中建立測試檔案或使用.test副檔名來讓 jest 載入檔案。請參閱範本項目以取得範例測試。 jest 文件也是一個很棒的資源，React Native 測試教學也是如此。
您可以使用環境變數來配置 Create React Native App 的一些行為。
啟動專案時，您將看到專案 URL 類似以下內容：
exp://192.168.0.2:19000
該 URL 處的「清單」告訴 Expo 應用程式如何檢索和載入應用程式的 JavaScript 套件，因此即使您透過像exp://localhost:19000這樣的URL 將其載入到應用程式中，Expo 用戶端應用程式仍會嘗試透過啟動腳本提供的 IP 位址來擷取您的應用程式。
在某些情況下，這並不理想。如果您需要在虛擬機器內執行項目，並且必須透過與預設列印的 IP 位址不同的 IP 位址來存取打包程序，則可能會發生這種情況。為了覆寫 Create React Native App 偵測到的 IP 位址或主機名，您可以透過REACT_NATIVE_PACKAGER_HOSTNAME環境變數指定您自己的主機名稱：
Mac 和 Linux：
REACT_NATIVE_PACKAGER_HOSTNAME='my-custom-ip-address-or-hostname' npm start
視窗：
set REACT_NATIVE_PACKAGER_HOSTNAME='my-custom-ip-address-or-hostname'
npm start
上面的範例將導致開發伺服器偵聽exp://my-custom-ip-address-or-hostname:19000 。
Create React Native App 做了很多工作，讓應用程式設定和開發變得簡單明了，但在不依賴託管服務的情況下部署到 Apple 的 App Store 或 Google 的 Play Store 則非常困難。
Expo 為 CRNA 創建的純 JS 應用程式提供免費託管，讓您可以透過 Expo 用戶端應用程式共用您的應用程式。這需要註冊一個 Expo 帳戶。
安裝exp命令列工具，並執行publish指令：
$ npm i -g exp
$ exp publish
如果您想獲得 IPA/APK 進行分發而無需自行建置本機程式碼，您還可以使用 Expo 的獨立建置等服務。
如果您想自己建置和部署應用程序，則需要從 CRNA 中退出並使用 Xcode 和 Android Studio。
這通常就像在專案中執行npm run eject一樣簡單，它將引導您完成整個過程。確保安裝react-native-cli並遵循React Native的本機程式碼入門指南。
如果您在處理專案時使用了 Expo API，那麼當您彈出到常規 React Native 專案時，這些 API 呼叫將停止運作。如果您想繼續使用這些 API，您可以彈出“React Native + ExpoKit”，這仍然允許您建立自己的本機程式碼並繼續使用 Expo API。有關此選項的更多詳細信息，請參閱彈出指南。
如果由於網路逾時或連接被拒絕而無法在手機上加載應用程序，那麼最好的第一步是驗證您的手機和電腦是否位於同一網路上，並且它們可以相互訪問。建立 React Native 應用程式需要存取連接埠 19000 和 19001，因此請確保您的網路和防火牆設定允許從您的裝置透過這兩個連接埠存取您的電腦。
嘗試在手機上開啟 Web 瀏覽器並開啟打包程式腳本列印的 URL，將exp://替換為http:// 。例如，如果您在終端機中的二維碼下方看到：
exp://192.168.0.1:19000
嘗試在手機上開啟 Safari 或 Chrome 並加載
http://192.168.0.1:19000
和
http://192.168.0.1:19001
如果這有效，但您仍然無法透過掃描二維碼載入應用程序，請在 Create React Native App 儲存庫上開啟一個問題，其中包含有關這些步驟的詳細資訊以及您可能收到的任何其他錯誤訊息。
如果您無法在手機的網路瀏覽器中載入http URL，請嘗試使用手機上的網路共用/行動熱點功能（但請注意資料使用），將電腦連接到該 WiFi 網絡，然後重新啟動打包程式。如果您使用 VPN，您可能需要停用它。
如果您使用的是 Mac，使用者在嘗試npm run ios時有時會看到一些錯誤：
您可能需要採取一些步驟來解決此類錯誤：
Command Line Tools選單選項已設定為某項。有時，當 Homebrew 首次安裝 CLI 工具時，此選項留空，這可能會阻止 Apple 實用程式找到模擬器。確保執行此操作後重新執行npm/yarn run ios 。Reset Contents and Settings...完成後，退出模擬器，然後重新執行npm/yarn run ios 。如果您無法掃描二維碼，請確保手機相機對焦正確，並確保終端中兩種顏色的對比度足夠高。例如，WebStorm 的預設主題可能沒有足夠的對比度，無法使用 Expo 應用程式使用的系統條碼掃描器掃描終端 QR 碼。
如果這給您帶來問題，您可能需要嘗試更改終端的顏色主題以獲得更多對比度，或從不同的終端執行 Create React Native App。您也可以在 Expo 應用程式的搜尋列中手動輸入打包器腳本列印的 URL 以手動載入它。
