Next.js自定义webpack配置下@sentry/nextjs浏览器端cwd报错如何解决

该报错是服务端专属的Sentry SDK代码被错误打包进了客户端运行包导致的：报错堆栈里的@sentry/nextjs/esm/index.server.js是仅支持在Node.js环境运行的模块，内部调用了Node.js特有的process.cwdAPI，浏览器环境不存在该API，所以抛出了属性读取错误。
你之前配置process fallback、注入process polyfill的方法无法解决问题，是因为没有从根源上避免服务端SDK进入客户端打包流程，哪怕有process对象，服务端SDK内部还有大量其他Node专属API依然会触发报错。

1. 修正Sentry客户端配置
   打开你的sentry.client.config.js文件，删除所有引入@sentry/node、@sentry/nextjs/server的代码，客户端仅需要引入@sentry/nextjs的客户端导出即可，参考配置：

// sentry.client.config.js
import * as Sentry from '@sentry/nextjs';

Sentry.init({
  dsn: "你的Sentry项目DSN",
  tracesSampleRate: 1.0,
  // 其他客户端专属配置，不要加服务端专属的配置项
});

2. 调整next.config.js的webpack配置
   在next.config.js的webpack配置中添加客户端打包时的别名转换，避免服务端模块被引入客户端包，同时删除你之前添加的无效配置：

// next.config.js
const { withSentryConfig } = require('@sentry/nextjs');

const nextConfig = {
  webpack: (config, { isServer }) => {
    // 仅客户端打包时生效
    if (!isServer) {
      // 将服务端Sentry模块别名指向客户端模块，避免误引入
      config.resolve.alias['@sentry/nextjs/server'] = '@sentry/nextjs/client';
      // 删除你之前加的process: false fallback配置，保留其他Node核心模块的false配置即可
      delete config.resolve.fallback.process;
    }
    return config;
  },
  // 其他你的Next.js配置项
};

// 用Sentry配置包裹Next.js配置，v6版本需要按照这个格式配置
module.exports = withSentryConfig(nextConfig, {
  silent: true,
});

3. 清理冗余依赖和配置

• 卸载你额外安装的process polyfill：npm uninstall process
• 删除你之前在webpack plugins中添加的webpack.ProvidePlugin注入process的相关配置，Next.js本身会处理客户端必要的process变量，额外注入会导致冲突。

4. 重启开发服务
   清理Next.js缓存后重启服务：

rm -rf .next
npm run dev

重启后访问页面即可解决该报错。

内容的提问来源于stack exchange，提问作者user372225