Skip to content

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

Closed
@geoport

Description

@geoport

Is there an existing issue for this?

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;
`

Metadata

Metadata

Assignees

No one assigned

    Labels

    Package: nextjsIssues related to the Sentry Nextjs SDK

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions