在next.js中调试获取操作

Question

所以我想调试我的next.js应用程序。问题是很大一部分是不会调试的。因此，我添加了铬附件调试器(在launch.json中)：

        {
        "type": "pwa-chrome",
        "request": "launch",
        "name": "Launch Chrome against localhost",
        "url": "http://localhost:3010",
        "webRoot": "${workspaceFolder}"
    }

所以我使用它的方式是在一个终端中运行："npm运行dev“，然后在vscode中按F5。这部分是因为react组件& next.js页面将被调试。问题是使用getStaticProps()进行的fetch调用不会。

因此，我查看了next.js和那里的文档--它是编写的，使用脚本，比如：" dev“：”NODE_OPTIONS=‘--检查’next dev‘“，然后在终端中运行"npm”，我得到了一个构建错误:命令"NODE_OPTIONS“写错了，或者找不到。

那么，如何调试像next.js ()这样的getStaticProps函数呢？另外，我应该给next.js写一张发行票吗？

编辑:它还应该提到，API是asp.net核心API，而不是next.js API。

编辑2:现在我通过使用SWR包绕过了这个问题。

Answer 1

我想你可以利用预览模式。它在请求时而不是构建时呈现页面，以便调试器/日志能够工作。您必须更新您的getStaticProps函数才能使用context.preview，这样它才能正常工作：

export async function getStaticProps(context) {
  // If context.preview is true, append "/preview" to the API endpoint
  // to request draft data instead of published data. This will vary
  // based on which headless CMS you're using.
  const res = await fetch(`https://.../${context.preview ? 'preview' : ''}`)
  // ...
}