In React Native project, I have html document in src directory. (Assuming that it named "./src/green.html").

And In MyScreen, I have a WebView for showing this page.

import WebView from 'react-native-webview';
import { Text, View, StyleSheet, Image } from 'react-native';

export default MyScreen (props) {
    const source = require('./green.html');
    const webviewSOurce = Image.resolveAssetSource(source);

    return (
        <View style>
            <WebView
                source={webSource}
                originWhitelist={["*"]}
                style={{
                    width:'100%',
                    minHeight:400
            }}/>
        </View>
    )

}

But it shows the content of html file as a plain text, not html.

    
    <div id="main-div">
    <h1>Hello World! I am alive!</h1>
    </div>

I visited https://github.com/react-native-webview/react-native-webview/blob/master/docs/Guide.md#loading-local-html-files, but I can't get a clear image and react-native-http-server causes some issues on my app.

How can I deal it? Is there any alternative ways to show local html page in WebView without react-native-static-server or react-native-http-server?