require('@grpc/grpc-js') returns undefined when using sentry configs on next-js app

[geoport]

Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which package are you using?

@sentry/nextjs

SDK Version

7.34.0

Framework Version

Next 12.0.4

Link to Sentry event

No response

SDK Setup

// This file sets a custom webpack configuration to use your Next.js app
// with Sentry.
// https://nextjs.org/docs/api-reference/next.config.js/introduction
// https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
const { withSentryConfig } = require('@sentry/nextjs');

/** @type {import('next').NextConfig} */
const nextConfig = {
	webpackDevMiddleware: (config) => {
		config.watchOptions = {
			poll: 1000,
			aggregateTimeout: 300,
		};
		return config;
	},
	reactStrictMode: true,
	env: {
		REACT_APP_DISABLE_WARNINGS: 1,
	},
	future: {
		webpack5: true, // by default, if you customize webpack config, they switch back to version 4.
		// Looks like backward compatibility approach.
	},
	webpack(config) {
		config.resolve.fallback = {
			...config.resolve.fallback, // if you miss it, all the other options in fallback, specified
			// by next.js will be dropped. Doesn't make much sense, but how it is
			fs: false, // the solution
		};

		return config;
	},
};

const sentryWebpackPluginOptions = {
	// Additional config options for the Sentry Webpack plugin. Keep in mind that
	// the following options are set automatically, and overriding them is not
	// recommended:
	//   release, url, org, project, authToken, configFile, stripPrefix,
	//   urlPrefix, include, ignore

	silent: true, // Suppresses all logs
	hideSourcemaps: true,
	// For all available options, see:
	// https://github.com/getsentry/sentry-webpack-plugin#options.
};

module.exports = withSentryConfig(nextConfig, sentryWebpackPluginOptions);

Steps to Reproduce

I'm trying to import @grpc/grpc-js inside an API call. When I changed the next.config.js as I shared, require('@grpc/grpc-js') returns undefined.

Expected Result

Importing grpc package without problem

Actual Result

`
TypeError: Cannot read properties of undefined (reading 'loadPackageDefinition')
4 | const grpc = require('@grpc/grpc-js');
5 | const pkgDefs = importProto('proto/goquake.proto');

6 | const goQuakeProto = grpc.loadPackageDefinition(pkgDefs).GoQuake;
`

[joshuajaco]

This issue is also related to using rollup-plugin-commonjs (See: #6943)

const grpc = require('@grpc/grpc-js');

Will be transformed to:

import grpc from '@grpc/grpc-js';

Which is not correct, since @grpc/grpc-js does not have a default export.

[lforst]

Hi, we just released an update that should fix this problem. https://github.com/getsentry/sentry-javascript/releases/tag/7.35.0

Let me know if upgrading the SDK fixes this issue for you!

[geoport]

Hi, I will try asp, thank you. Android için Outlook<https://aka.ms/AAb9ysg> edinin

…

________________________________ From: Luca Forstner ***@***.***> Sent: Wednesday, February 1, 2023 4:39:57 PM To: getsentry/sentry-javascript ***@***.***> Cc: geoport ***@***.***>; Author ***@***.***> Subject: Re: [getsentry/sentry-javascript] ***@***.***/grpc-js') returns undefined when using sentry configs on next-js app (Issue #6970) Hi, we just released an update that should fix this problem. https://github.com/getsentry/sentry-javascript/releases/tag/7.35.0 Let me know if upgrading the SDK fixes this issue for you! — Reply to this email directly, view it on GitHub<#6970 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/AXLNG2PX74JN76PXSM347VDWVJRS3ANCNFSM6AAAAAAUK3WPEY>. You are receiving this because you authored the thread.Message ID: ***@***.***>