Sentry 源地图 - 故障排除

Question

我正在尝试让源映射与 Sentry 一起用于 ReactJS 应用程序。我将 webpack 与 SentryWebpackPlugin 结合使用。webpack config 中的相关配置如下所示：

const SentryWebpackPlugin = require('@sentry/webpack-plugin');

const SentryOptions = {
  // sentry-cli configuration
  authToken: process.env.SENTRY_AUTH_TOKEN,
  project: process.env.SENTRY_PROJECT,

  // webpack specific configuration
  include: pathLibrary.resolve(__dirname, '..')
};

module.exports = {
  devtool: 'hidden-source-map',
  output: {
    filename: '[name].[contenthash].js',
    chunkFilename: '[name].[contenthash].js',
    publicPath: '',
    path: pathLibrary.resolve(__dirname, '..', 'public'),
    sourceMapFilename: '../tmp/sourcemaps/[file].map'
  }
}

if (DEPLOY_ENVS.includes(env)) {
  module.exports.plugins.push(new SentryWebpackPlugin(SentryOptions));
}

当我构建和部署应用程序时，我确实可以在 Sentry 中看到源映射和源代码，但是问题页面上显示的代码似乎不可读。这让我相信我在命名输出文件或源映射方面做了一些错误的事情。