The content of my Next js app is not being loaded in my WebView.
I have a simple next js app that i want to load as static file in a WebView.To do that i ran:
npx next build npx next exportthen i copied the newly created /out folder in my React-Native app. ( For android android/app/src/main/assets/out ).
This is the index.html file:
<!DOCTYPE html><html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width" /><meta name="next-head-count" content="2" /><noscript data-n-css=""></noscript><script defer="" nomodule="" src="./_next/static/chunks/polyfills-5cd94c89d3acac5f.js"></script><script src="./_next/static/chunks/webpack-434fefa8f39d8fbc.js" defer=""></script><script src="./_next/static/chunks/framework-0e90cbf53d3785fb.js" defer=""></script><script src="./_next/static/chunks/main-f65e66e62fc5ca80.js" defer=""></script><script src="./_next/static/chunks/pages/_app-d147581f7d5a26ef.js" defer=""></script><script src="./_next/static/chunks/ffe6318b-78fdf1aa1284bb62.js" defer=""></script><script src="./_next/static/chunks/d9fcd7e1-1af5f391065d9528.js" defer=""></script><script src="./_next/static/chunks/957d5091-e6e13748ee910e93.js" defer=""></script><script src="./_next/static/chunks/91ed190f-8481ca3f0c149074.js" defer=""></script><script src="./_next/static/chunks/fec483df-e3f27fc2944a8470.js" defer=""></script><script src="./_next/static/chunks/8015bd09-8f6407b97da9214f.js" defer=""></script><script src="./_next/static/chunks/705-03f6e1a04c95ed80.js" defer=""></script><script src="./_next/static/chunks/pages/index-7da29ff49b69596f.js" defer=""></script><script src="./_next/static/gF9J6oBqA-HcXJwf93Cir/_buildManifest.js" defer=""></script><script src="./_next/static/gF9J6oBqA-HcXJwf93Cir/_ssgManifest.js" defer=""></script><script src="./_next/static/gF9J6oBqA-HcXJwf93Cir/_middlewareManifest.js" defer=""></script></head><body><h1>Hello here</h1><div id="__next" data-reactroot=""><div></div></div><script id="__NEXT_DATA__" type="application/json"> {"props": { "pageProps": {} },"page": "/","query": {},"buildId": "gF9J6oBqA-HcXJwf93Cir","nextExport": true,"autoExport": true,"isFallback": false,"scriptLoader": [] }</script></body></html>The <h1>Hello there</h1> gets rendered, i added it to see if the index.html file is found.
In src="./_next/static/chunks/pages/index-7da29ff49b69596f.js"is a <div>hi</div> which doesn't get rendered, i put it there to test if it loads the files at all.
This is how i load the WebView:
<WebView ref={webviewRef} scalesPageToFit={false} mixedContentMode="compatibility" onMessage={onMessage} originWhitelist={['*']} javaScriptEnabled={true} source={{ uri: 'file:///android_asset/out/index.html', }} />What am i doing wrong?Is this even possible?