使用react-native （“omnibar”和WebView ）构建的移动Web浏览器的非常粗略的草图。浏览器与网关 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 以手动加载它。
