I am attempting to export a Next.js web application as static files and embed it within a Flutter app using a WebView. Here are the steps I have followed:

1. In next.config.js, I added output: 'export' to export the static pages.
2. I verified that the out folder contains the index.html file, and all resource references within are absolute paths.
3. In the Flutter WebView, I am loading out/index.html.

However, I encountered an issue where the page fails to load related resources (JS, CSS, etc.) due to the use of absolute paths, resulting in a failure to find the files.

Problem:

• Absolute Paths: The static export references resources using absolute paths (e.g., href="/_next/static/css/15dae4bea6361a30.css"), which leads to loading issues within the WebView.
• Server Requirement: I understand that serving the out folder with a server would resolve this, but I am unsure how to serve the out folder within a Flutter WebView instead of loading index.html directly.
• CORS Issues: I tried modifying index.html to use relative paths (e.g., href="./_next/static/css/15dae4bea6361a30.css"), but this results in CORS issues.

Question:

How can I properly embed the exported static Next.js site in a Flutter WebView, ensuring all resources are loaded correctly? Is there a way to serve the out folder within Flutter, or is there an alternative approach to handle the path and CORS issues?

Any guidance or examples would be greatly appreciated!