reactjs - 如何在 React-Native Webview 中运行 React JS 构建？

Question

我创建了完整的离线 ReactJS Web 应用程序，我想使用 React-Native 从 Web View 的 Android 应用程序运行它。

我按照以下步骤执行此操作:
1. 我创建了一个已编译的 ReactJS Web 应用程序，使用以下命令获取了 build:

npm run build

然后我创建了react-native项目并放置了具有以下架构的build文件夹

我使用以下内容更新了 App.js:

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View, WebView} from 'react-native';
import {roscon} from "./build/index.html";

type Props = {};
export default class App extends Component<Props> {
  render() {
    return (
      <View style={{height: 300, width: 300,overflow:'hidden' }}>
          <WebView
            source={{uri: roscon}}
            scalesPageToFit={true}
            domStorageEnabled={true}
            javaScriptEnabled={true}
            startInLoadingState={true}
          />
      </View>
    );
  }
}

运行此代码后，我希望它能够运行我的 ReactJS Web 应用程序，但我得到了白屏。

您能告诉我是什么原因导致的问题以及如何让我的 ReactJS Web 应用程序在 React-Native 上运行吗？

注意:我能够使用 npm 命令运行生成的 build 文件夹

serve -s build

但我仍然不知道如何将其作为WebView移植到react-native项目

Answer 1

经过研究和测试，我找到了解决方案。我发现的主要问题是编译的 build 文件夹呈现为 static html。它需要一个服务器来提供页面服务。

所以，我遵循了这个link用于获取 build 项目以使其启动并运行然后，将其与 nodejs Android Project Samples 集成让我的 build 文件夹作为 Webview 在 android 中运行。

注意:我也尝试了 react-snapshot 和 react-snap 但它们没有给出令人满意的结果。