Next.js Sentry源地图大小太大

Question

我正在尝试使用next.js的源地图功能，以便更好地调试sentry，但当我构建下一个应用程序时，它试图将大的源地图文件上传到sentry.Is，有什么问题吗？

​

​

另外，我的next.config.js配置是这样的。

const SentryWebpackPlugin = require('@sentry/webpack-plugin');
const withSourceMaps = require('@zeit/next-source-maps')();

webpack: (config, { dev, isServer, buildId }) => {
    if (!isServer) {
      config.resolve.alias['@sentry/node'] = '@sentry/browser';
    }
    if (process.env.NODE_ENV === 'production') {
      config.plugins.push(
        new SentryWebpackPlugin({
          include: './app/.next',
          ignore: ['node_modules'],
          urlPrefix: '~/_next',
          release: buildId,
        }),
      );
    }

    return config;}

Answer 1

• npm remove @zeit/next-source-maps

• npm i next@latest

nextjs现在有内置的配置来在生产https://nextjs.org/docs/advanced-features/source-maps中启用源映射，我还建议忽略*.css.map和其他不需要的文件，所以不要上传它们。

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

...
module.exports = {
...
productionBrowserSourceMaps: process.env.NODE_ENV === 'production',
...
webpack: (config, { dev, isServer, buildId }) => {
    if (!isServer) {
      config.resolve.alias['@sentry/node'] = '@sentry/browser';
    }
    if (process.env.NODE_ENV === 'production') {
      config.plugins.push(
        new SentryWebpackPlugin({
          include: './app/.next',
          ignore: ['node_modules', '*.css.map'],
          stripPrefix: ['webpack://_N_E/'],
          urlPrefix: '~/_next',
          release: buildId,
        }),
      );
    }

    return config;
}