Next.js：在构建/预渲染期间使用源映射来查找错误

Question

是否可以使用生成代码的源映射来获取构建期间预渲染所发出的错误的完整堆栈跟踪？

目前，如果在 期间预渲染页面失败next build，则错误堆栈跟踪输出来自缩小的代码而不是项目的实际源，这使得跟踪错误变得非常困难。

即使productionBrowserSourceMaps启用了 in next.config.js，预渲染似乎仍然会发出带有缩小的堆栈跟踪的错误，这使得查找源非常困难。

Answer 1

经过大量的挖掘和实验，是的，似乎可以！

通过在 Next.js 使用的 Webpack 配置中强制启用源映射，我从预渲染构建错误中获得了正确的源映射错误日志（仅在服务器上下文中，我们不想将源泄漏给客户端）：

// next.config.js
module.exports = {
  webpack(config, options) {
    if (options.isServer) config.devtool = 'source-map';
    return config;
  },
};

这将确保 Next.js 为构建期间用于预渲染的所有 JS 文件生成源映射。要获取错误堆栈跟踪并使用它们，需要在 Next.js 构建时启用 Node.js 的源映射支持，这可以通过传递NODE_OPTIONS=--enable-source-maps next build.