Skip to content

ref(nextjs): Simplify NextConfigObject type #5514

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Aug 2, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 15 additions & 15 deletions packages/nextjs/src/config/index.ts
Original file line number Diff line number Diff line change
@@ -1,33 +1,33 @@
import { ExportedNextConfig, NextConfigFunction, NextConfigObject, SentryWebpackPluginOptions } from './types';
import type { ExportedNextConfig, NextConfigFunction, NextConfigObject, SentryWebpackPluginOptions } from './types';
import { constructWebpackConfigFunction } from './webpack';

/**
* Add Sentry options to the config to be exported from the user's `next.config.js` file.
*
* @param userNextConfig The existing config to be exported prior to adding Sentry
* @param exportedUserNextConfig The existing config to be exported prior to adding Sentry
* @param userSentryWebpackPluginOptions Configuration for SentryWebpackPlugin
* @returns The modified config to be exported
*/
export function withSentryConfig(
userNextConfig: ExportedNextConfig = {},
exportedUserNextConfig: ExportedNextConfig = {},
userSentryWebpackPluginOptions: Partial<SentryWebpackPluginOptions> = {},
): NextConfigFunction | Partial<NextConfigObject> {
): NextConfigFunction | NextConfigObject {
// If the user has passed us a function, we need to return a function, so that we have access to `phase` and
// `defaults` in order to pass them along to the user's function
if (typeof userNextConfig === 'function') {
return function (phase: string, defaults: { defaultConfig: NextConfigObject }): Partial<NextConfigObject> {
const materializedUserNextConfig = userNextConfig(phase, defaults);
if (typeof exportedUserNextConfig === 'function') {
return function (phase: string, defaults: { defaultConfig: NextConfigObject }): NextConfigObject {
const userNextConfigObject = exportedUserNextConfig(phase, defaults);

// Next 12.2.3+ warns about non-canonical properties on `userNextConfig`, so grab and then remove the `sentry`
// property there. Where we actually need it is in the webpack config function we're going to create, so pass it
// to `constructWebpackConfigFunction` so that it will be in the created function's closure.
const { sentry: userSentryOptions } = materializedUserNextConfig;
delete materializedUserNextConfig.sentry;
const { sentry: userSentryOptions } = userNextConfigObject;
delete userNextConfigObject.sentry;

return {
...materializedUserNextConfig,
...userNextConfigObject,
webpack: constructWebpackConfigFunction(
materializedUserNextConfig,
userNextConfigObject,
userSentryWebpackPluginOptions,
userSentryOptions,
),
Expand All @@ -39,11 +39,11 @@ export function withSentryConfig(

// Prevent nextjs from getting mad about having a non-standard config property in `userNextConfig`. (See note above
// for a more thorough explanation of what we're doing here.)
const { sentry: userSentryOptions } = userNextConfig;
delete userNextConfig.sentry;
const { sentry: userSentryOptions } = exportedUserNextConfig;
delete exportedUserNextConfig.sentry;

return {
...userNextConfig,
webpack: constructWebpackConfigFunction(userNextConfig, userSentryWebpackPluginOptions, userSentryOptions),
...exportedUserNextConfig,
webpack: constructWebpackConfigFunction(exportedUserNextConfig, userSentryWebpackPluginOptions, userSentryOptions),
};
}
20 changes: 9 additions & 11 deletions packages/nextjs/src/config/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,19 +8,20 @@ export type SentryWebpackPlugin = WebpackPluginInstance & { options: SentryWebpa
* Overall Nextjs config
*/

export type ExportedNextConfig = Partial<NextConfigObject> | NextConfigFunction;
export type ExportedNextConfig = NextConfigObject | NextConfigFunction;

export type NextConfigObject = {
// custom webpack options
webpack: WebpackConfigFunction;
webpack?: WebpackConfigFunction;
// whether to build serverless functions for all pages, not just API routes
target: 'server' | 'experimental-serverless-trace';
target?: 'server' | 'experimental-serverless-trace';
// the output directory for the built app (defaults to ".next")
distDir: string;
distDir?: string;
// the root at which the nextjs app will be served (defaults to "/")
basePath?: string;
// config which will be available at runtime
publicRuntimeConfig?: { [key: string]: unknown };
sentry?: UserSentryOptions;
} & {
// other `next.config.js` options
[key: string]: unknown;
};

export type UserSentryOptions = {
Expand All @@ -40,10 +41,7 @@ export type UserSentryOptions = {
widenClientFileUpload?: boolean;
};

export type NextConfigFunction = (
phase: string,
defaults: { defaultConfig: NextConfigObject },
) => Partial<NextConfigObject>;
export type NextConfigFunction = (phase: string, defaults: { defaultConfig: NextConfigObject }) => NextConfigObject;

/**
* Webpack config
Expand Down
2 changes: 1 addition & 1 deletion packages/nextjs/src/config/webpack.ts
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ export { SentryWebpackPlugin };
* @returns The function to set as the nextjs config's `webpack` value
*/
export function constructWebpackConfigFunction(
userNextConfig: Partial<NextConfigObject> = {},
userNextConfig: NextConfigObject = {},
userSentryWebpackPluginOptions: Partial<SentryWebpackPluginOptions> = {},
userSentryOptions: UserSentryOptions = {},
): WebpackConfigFunction {
Expand Down
4 changes: 2 additions & 2 deletions packages/nextjs/test/config.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ afterEach(() => {
});

/** Mocks of the arguments passed to `withSentryConfig` */
const userNextConfig: Partial<NextConfigObject> = {
const userNextConfig: NextConfigObject = {
publicRuntimeConfig: { location: 'dogpark', activities: ['fetch', 'chasing', 'digging'] },
webpack: (config: WebpackConfigObject, _options: BuildContext) => ({
...config,
Expand Down Expand Up @@ -124,7 +124,7 @@ const clientWebpackConfig = {
// dynamically.
function getBuildContext(
buildTarget: 'server' | 'client',
userNextConfig: Partial<NextConfigObject>,
userNextConfig: NextConfigObject,
webpackVersion: string = '5.4.15',
): BuildContext {
return {
Expand Down