reactjs - 如何导出 Next.js 静态应用程序以在 Chrome 扩展中使用？

Question

如何在 out/index.html 中内联 _next/* 文件？

如何将 manifest.json 中的 _next/ 目录列入白名单？

---

我按照 exporting a static app 的说明进行操作，并使用了一个简单的 list 。

** 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 构建和 yarn 导出来自/E1-static-export
2. 在 chrome://extensions 中加载解压的扩展程序
3. 右键单击浏览器图标检查弹出窗口

Filed an issue因为我花了大约 5 个小时进行研究!

谢谢

Answer 1

TLDR；我正在研究更好的解决方案，但我发现 Chrome 在目录路径中不遵循下划线。

我的错误与 CSP 无关，我只需将 _next 重命名为 Znext 并重命名该目录中的所有匹配项。按照静态导出教程，我最终得到了一个可导航的“default_popup”调色板，其中包含完美的客户端路由和我所需的包(加密)。

无需更改“web_accessible_resources”或“content_security_policy”。