React Native WebView 离线优先或本地内容答案

【问题标题】：React Native WebView offline-first or local contentReact Native WebView 离线优先或本地内容
【发布时间】：2018-11-15 19:05:30
【问题描述】：

我正在构建带有集成 AppCenter SDK 的 React Native 应用程序（分析、崩溃报告、CodePush 用于应用内更新）。此应用程序只是我们在线 Web 演示的“包装器”。要求是使其离线优先能够更新包装器或网络演示。

我的想法是使用本地 HTML 源将 Web 演示文件附加到 React Native 项目和 WebView。但是 - 它只适用于模拟器。 React Native 打包器（或捆绑器）可以渲染完整的 HTML 文件及其所有内部依赖项（JS、字体、CSS、其他资产）。像这样：

import htmlSource from './presentation/index.html'

<WebView
    source={htmlSource}
    style={styles.webview}
/>

这在模拟器上运行良好，但是当我创建生产构建时，JS 包不包含任何 HTML 依赖项，因此演示文稿只是没有样式和任何其他资产的原始 HTML。所以我无法使用 WebView 呈现完整的演示文稿。创建 CodePush 版本（用于应用内更新）是相同的 - 没有资产。

你有什么想法可以让它工作吗？我需要能够在设备离线时呈现演示文稿，但在连接时，能够更新它。

我们不想对 App Store 进行完整的部署过程，因为它的审核/验证过程很长。

为什么它可以在模拟器上运行，但在生产版本中却不起作用？是否可以通过不同的方式捆绑所有 HTMl 文件依赖项？或者，如果我指向 URL 地址，是否可以离线缓存 WebView 内容？

感谢您的任何想法。

【问题讨论】：

【解决方案1】：

react-native bundle --entry-file index.ios.js --platform ios --dev false --bundle-output release_ios/index.ios.jsbundle --assets-dest release_ios/

然后将你本地的css、assets...拖到assets

【讨论】：