How to export Next.js static app for use in a Chrome Extension?

Question

How can I inline _next/* files in out/index.html ?

How can I whitelist _next/ directory in manifest.json ?

---

I followed the instructions for exporting a static app , and used a simple manifest.

** manifest.json **
{
  "manifest_version": 2,
  "name": "E1-static-export",
  "version": "0.1",
  "description": "Demo static export with inline / CSP hashes",
  "browser_action": {
    "default_popup": "out/index.html"
  }
}

1. yarn build && yarn export from /E1-static-export
2. load unpacked extension in chrome://extensions
3. right click browser icon Inspect Popup

Filed an issue because I've spend ~5 hours researching!

Thanks

Answer 1

TLDR; I'm working on a better solution, but I discovered that Chrome doesn't follow underscores in the directory path.

My error had nothing to do with CSP, I merely had to rename _next to Znext and rename all occurrences within that directory. Following the static export tutorial, I ended up with a navigable "default_popup" palette with flawless client-side routing and my required package (crypto).

No need for "web_accessible_resources" or "content_security_policy" changes.

Answer 2

这是我发现可能有用的一篇文章