NET::ERR_CLEARTEXT_NOT_PERMITTED from react-native-webview in Android

Question

We are using a WebView from react-native-webview in our app to show a preview of an email. The preview itself is a HTML file that is located in the repo, so we are requiring it and passing it to the WebView component like so:

  const emailHtml = require('./ConfirmationEmailPreview.html');

  <WebView
    source={emailHtml}
    //Other props
  />

However, on Android the HTML is not rednered and instead the following error message is displayed: NET::ERR_CLEARTEXT_NOT_PERMITTED. I understand that this is a security feature but don't understand why it is triggered for a local file. I have seen some advice online (see here) on how to resolve this issue, but the suggestions either seem to come with security risks or require the HTML to come from a domain.

Is there a way to prevent this from causing an error WITHOUT adding android:usesCleartextTraffic=”true” to the AndroidManifest.xml file? I want to avoid this as Google advises against permitting cleartext due to security issues.