如何告诉 SentryWebpackPlugin 我的源映射的名称？

Question

1) 我的网页代码是用 TypeScript 编写的，我使用 WebPack 将其捆绑到最终用户的“main.min.js”文件中。（非常标准的东西。）

2) 我想利用Sentry.io服务自动向云端报告错误，因此我安装了该@sentry/browser包并在我的 TypeScript 代码库中对其进行了初始化。到目前为止一切顺利 - 我的网页成功向 Sentry 报告错误。

3) 然而，报告的错误不包含真实的行号，例如源映射。为了解决这个问题，Sentry 文档说您需要使用SentryWebpackPlugin. 所以，我已经安装了它，并将我的 WebPack 配置更改为以下内容：

import SentryWebpackPlugin from '@sentry/webpack-plugin';
import * as path from 'path';
import * as webpack from 'webpack';

// Constants
const epoch = new Date().getTime();

const config: webpack.Configuration = {
    // The entry file to bundle
    entry: path.join(__dirname, 'src', 'main.ts'),

    // Where to put the bundled file
    output: {
        path: __dirname, // By default, Webpack will output the file to a "dist" subdirectory
        filename: 'main.min.js',
        // Chrome caches source maps and will not update them even after a hard-refresh
        // Work around this by putting the epoch timestamp in the source map filename
        sourceMapFilename: `main.min.js.${epoch}.map`,
    },

    resolve: {
        extensions: ['.js', '.ts', '.json'],
    },

    module: {
        rules: [
            // All files with a ".ts" extension (TypeScript files) will be handled by "ts-loader"
            {
                test: /\.ts$/,
                include: path.join(__dirname, 'src'),
                loader: 'ts-loader',
            },
        ],
    },

    plugins: [
        new SentryWebpackPlugin({
            include: './main.min.js',
        }),
    ],

    // Enable source maps
    devtool: 'source-map',
};

export default config;

这是一种极其基本的 WebPack 配置，但有一个例外 - 自定义源映射文件名。默认情况下，大多数源映射将“main.min.js.map”的文件名作为“main.min.js”文件。但是，请注意，在上面的配置中，我将其更改为“main.min.js.1586110008375.map”，以解决 Chrome 缓存源映射的错误，即使在硬刷新后也不会更新它们。

4) 现在，当我告诉 WebPack 捆绑我的代码时，新的 Sentry 插件抱怨它找不到源映射：

Source Map Upload Report
  Minified Scripts
    ~/main.min.js (sourcemap at backend.js.map)
      - warning: could not determine a source map reference (Could not auto-detect referenced sourcemap for ~/main.min.js.)

如何告诉 SentryWebpackPlugin 我的自定义源映射的名称是什么？

GitHub 页面在这里，文档在这里，但他们似乎没有提到如何做这个看似微不足道的事情。

Answer 1

检查你的productionSourceMap: true，当它是真的时，你可以得到sourcemap