Include local CSS/JavaScript in WebView

So I realize this is similar to the (unresolved) issue here: [SOLVED] Local javascript in webview

But I’ve been scouring the web for a couple days now trying to figure out how to include a local HTML file in webview along with its CSS and JS dependencies. The user in the above issue included everything in string form, which is not an option for me (and it’s a terrible solution).

My situation is this: in local development, I can access a local HTML file and dependencies with no issue using this pattern in WebView: “source={require(‘…/…/assets/cesium/cesium.html’)}”

However, when I publish, the associated CSS and JS is either lost or rendered inaccessible. I have tried bundling it with assets in bundleAssetsPatterns but no luck.

One solution I’ve found is here: https://github.com/facebook/react-native/issues/1442#issuecomment-106906969

But it requires creating native directories in Xcode and Android Studio (and thus ejecting, which I would prefer to avoid).

This solution would look like such: “source={{ html: insertHTML, baseUrl: ‘/assets/cesium’ }}”

I assumed since I added this “cesium” folder to bundle patterns that it would be available. But it is not.

Another solution is here: Problem with Webview after 'exp publish'

But that requires hosting the files on a remote server and then pulling them in with the FileSystem API, which also seems ridiculous.

Any tips? Will I be forced to eject? Thanks.

Jordan

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.