From 99d0cb9f734ab46610d196479b21ee4a03098efe Mon Sep 17 00:00:00 2001 From: Steven Date: Fri, 8 Aug 2025 20:31:37 -0400 Subject: [PATCH 1/4] ix: add `?dpl` to fonts in `/_next/static/media` part 2 --- packages/font/src/local/loader.test.ts | 6 ++++++ packages/font/src/local/loader.ts | 5 ++++- packages/next/font/index.d.ts | 1 + packages/next/src/build/webpack-config.ts | 2 ++ .../build/webpack/config/blocks/css/loaders/next-font.ts | 1 + packages/next/src/build/webpack/config/index.ts | 3 +++ packages/next/src/build/webpack/config/utils.ts | 1 + .../src/build/webpack/loaders/next-font-loader/index.ts | 4 +++- 8 files changed, 21 insertions(+), 2 deletions(-) diff --git a/packages/font/src/local/loader.test.ts b/packages/font/src/local/loader.test.ts index 85168f4083910..dddaa58f18894 100644 --- a/packages/font/src/local/loader.test.ts +++ b/packages/font/src/local/loader.test.ts @@ -5,6 +5,7 @@ describe('next/font/local loader', () => { test('Default CSS', async () => { const { css } = await nextFontLocalFontLoader({ functionName: '', + deploymentId: undefined, data: [{ src: './my-font.woff2' }], emitFontFile: () => '/_next/static/media/my-font.woff2', resolve: jest.fn(), @@ -31,6 +32,7 @@ describe('next/font/local loader', () => { test('Weight and style', async () => { const { css } = await nextFontLocalFontLoader({ functionName: '', + deploymentId: undefined, data: [{ src: './my-font.woff2', weight: '100 900', style: 'italic' }], emitFontFile: () => '/_next/static/media/my-font.woff2', resolve: jest.fn(), @@ -59,6 +61,7 @@ describe('next/font/local loader', () => { test('Other properties', async () => { const { css } = await nextFontLocalFontLoader({ functionName: '', + deploymentId: undefined, data: [ { src: './my-font.woff2', @@ -95,6 +98,7 @@ describe('next/font/local loader', () => { test('Multiple weights default style', async () => { const { css } = await nextFontLocalFontLoader({ functionName: '', + deploymentId: undefined, data: [ { style: 'italic', @@ -171,6 +175,7 @@ describe('next/font/local loader', () => { test('Multiple styles default weight', async () => { const { css } = await nextFontLocalFontLoader({ functionName: '', + deploymentId: undefined, data: [ { weight: '400', @@ -233,6 +238,7 @@ describe('next/font/local loader', () => { test('Custom font-family in declarations', async () => { const { css } = await nextFontLocalFontLoader({ functionName: '', + deploymentId: undefined, data: [ { src: './my-font.woff2', diff --git a/packages/font/src/local/loader.ts b/packages/font/src/local/loader.ts index c5db34d7d5839..8d85d3d3fbf27 100644 --- a/packages/font/src/local/loader.ts +++ b/packages/font/src/local/loader.ts @@ -19,6 +19,7 @@ const nextFontLocalFontLoader: FontLoader = async ({ data, emitFontFile, resolve, + deploymentId, loaderContext, }) => { const { @@ -45,6 +46,8 @@ const nextFontLocalFontLoader: FontLoader = async ({ preload, typeof adjustFontFallback === 'undefined' || !!adjustFontFallback ) + // Should match behavior in get-asset-query-string.ts + const qs = `${fontUrl.includes('?') ? '&' : '?'}dpl=${deploymentId}` // Try to load font metadata from the font file using fontkit. // The data is used to calculate the fallback font override values. @@ -66,7 +69,7 @@ const nextFontLocalFontLoader: FontLoader = async ({ ? declarations.map(({ prop, value }) => [prop, value]) : []), ...(hasCustomFontFamily ? [] : [['font-family', variableName]]), - ['src', `url(${fontUrl}) format('${format}')`], + ['src', `url(${fontUrl + qs}) format('${format}')`], ['font-display', display], ...(weight ?? defaultWeight ? [['font-weight', weight ?? defaultWeight]] diff --git a/packages/next/font/index.d.ts b/packages/next/font/index.d.ts index fe10e31d59b92..0d97d953a96a5 100644 --- a/packages/next/font/index.d.ts +++ b/packages/next/font/index.d.ts @@ -19,6 +19,7 @@ export type FontLoader = (options: { resolve: (src: string) => string isDev: boolean isServer: boolean + deploymentId: string | undefined loaderContext: any }) => Promise<{ css: string diff --git a/packages/next/src/build/webpack-config.ts b/packages/next/src/build/webpack-config.ts index d4a58bcbafff7..f3a814c7ba590 100644 --- a/packages/next/src/build/webpack-config.ts +++ b/packages/next/src/build/webpack-config.ts @@ -2316,6 +2316,7 @@ export default async function getBaseWebpackConfig( basePath: config.basePath, excludeDefaultMomentLocales: config.excludeDefaultMomentLocales, assetPrefix: config.assetPrefix, + deploymentId: config.deploymentId, disableOptimizedLoading, isEdgeRuntime: isEdgeServer, reactProductionProfiling, @@ -2454,6 +2455,7 @@ export default async function getBaseWebpackConfig( isEdgeRuntime: isEdgeServer, targetWeb: isClient || isEdgeServer, assetPrefix: config.assetPrefix || '', + deploymentId: config.deploymentId, sassOptions: config.sassOptions, productionBrowserSourceMaps: config.productionBrowserSourceMaps, future: config.future, diff --git a/packages/next/src/build/webpack/config/blocks/css/loaders/next-font.ts b/packages/next/src/build/webpack/config/blocks/css/loaders/next-font.ts index 10ec131f9e0af..55909b3d5e3a3 100644 --- a/packages/next/src/build/webpack/config/blocks/css/loaders/next-font.ts +++ b/packages/next/src/build/webpack/config/blocks/css/loaders/next-font.ts @@ -62,6 +62,7 @@ export function getNextFontLoader( isDev: ctx.isDevelopment, isServer: ctx.isServer, assetPrefix: ctx.assetPrefix, + deploymentId: ctx.deploymentId, fontLoaderPath, postcss, }, diff --git a/packages/next/src/build/webpack/config/index.ts b/packages/next/src/build/webpack/config/index.ts index 4daa1b35696a2..ccd7d4203374d 100644 --- a/packages/next/src/build/webpack/config/index.ts +++ b/packages/next/src/build/webpack/config/index.ts @@ -19,6 +19,7 @@ export async function buildConfiguration( isEdgeRuntime, targetWeb, assetPrefix, + deploymentId, sassOptions, productionBrowserSourceMaps, future, @@ -36,6 +37,7 @@ export async function buildConfiguration( isEdgeRuntime: boolean targetWeb: boolean assetPrefix: string + deploymentId: string | undefined sassOptions: any productionBrowserSourceMaps: boolean transpilePackages: NextConfigComplete['transpilePackages'] @@ -61,6 +63,7 @@ export async function buildConfiguration( ? assetPrefix.slice(0, -1) : assetPrefix : '', + deploymentId, sassOptions, productionBrowserSourceMaps, transpilePackages, diff --git a/packages/next/src/build/webpack/config/utils.ts b/packages/next/src/build/webpack/config/utils.ts index 004e0acac5b6d..c3862a11099ff 100644 --- a/packages/next/src/build/webpack/config/utils.ts +++ b/packages/next/src/build/webpack/config/utils.ts @@ -19,6 +19,7 @@ export type ConfigurationContext = { targetWeb: boolean assetPrefix: string + deploymentId: string | undefined sassOptions: any productionBrowserSourceMaps: boolean diff --git a/packages/next/src/build/webpack/loaders/next-font-loader/index.ts b/packages/next/src/build/webpack/loaders/next-font-loader/index.ts index b50745f79d539..9740c07e90d5b 100644 --- a/packages/next/src/build/webpack/loaders/next-font-loader/index.ts +++ b/packages/next/src/build/webpack/loaders/next-font-loader/index.ts @@ -45,6 +45,7 @@ export default async function nextFontLoader(this: any) { assetPrefix, fontLoaderPath, postcss: getPostcss, + deploymentId, } = this.getOptions() if (assetPrefix && !/^\/|https?:\/\//.test(assetPrefix)) { @@ -66,7 +67,7 @@ export default async function nextFontLoader(this: any) { * NextFontManifestPlugin uses this to see if fallback fonts are being used. * This is used to collect stats on fallback fonts usage by the Google Aurora team. */ - const emitFontFile = ( + const emitFontFile: Parameters[0]['emitFontFile'] = ( content: Buffer, ext: string, preload: boolean, @@ -109,6 +110,7 @@ export default async function nextFontLoader(this: any) { ), isDev, isServer, + deploymentId, loaderContext: this, }) ) From ca4e664879a91bc4461aad263535522ba6ee867e Mon Sep 17 00:00:00 2001 From: Steven Date: Sat, 9 Aug 2025 11:52:17 -0400 Subject: [PATCH 2/4] Update packages/font/src/local/loader.ts --- packages/font/src/local/loader.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/font/src/local/loader.ts b/packages/font/src/local/loader.ts index 8d85d3d3fbf27..49fb93c323828 100644 --- a/packages/font/src/local/loader.ts +++ b/packages/font/src/local/loader.ts @@ -47,7 +47,9 @@ const nextFontLocalFontLoader: FontLoader = async ({ typeof adjustFontFallback === 'undefined' || !!adjustFontFallback ) // Should match behavior in get-asset-query-string.ts - const qs = `${fontUrl.includes('?') ? '&' : '?'}dpl=${deploymentId}` + const qs = deploymentId + ? `${fontUrl.includes('?') ? '&' : '?'}dpl=${deploymentId}` + : '' // Try to load font metadata from the font file using fontkit. // The data is used to calculate the fallback font override values. From 3375828b542a6d24b2c532f2b092be61d43a4bc6 Mon Sep 17 00:00:00 2001 From: Steven Date: Mon, 11 Aug 2025 09:06:30 -0400 Subject: [PATCH 3/4] add test --- packages/font/src/google/loader.test.ts | 1 + packages/font/src/local/loader.test.ts | 27 +++++++++++++++++++++++++ 2 files changed, 28 insertions(+) diff --git a/packages/font/src/google/loader.test.ts b/packages/font/src/google/loader.test.ts index f636443c71898..9884eb7a2eae1 100644 --- a/packages/font/src/google/loader.test.ts +++ b/packages/font/src/google/loader.test.ts @@ -124,6 +124,7 @@ describe('next/font/google loader', () => { mockFetchResource.mockResolvedValue(Buffer.from('OK')) const { css } = await nextFontGoogleFontLoader({ functionName, + deploymentId: undefined, data: [ { adjustFontFallback: false, diff --git a/packages/font/src/local/loader.test.ts b/packages/font/src/local/loader.test.ts index dddaa58f18894..7145062ab7b05 100644 --- a/packages/font/src/local/loader.test.ts +++ b/packages/font/src/local/loader.test.ts @@ -29,6 +29,33 @@ describe('next/font/local loader', () => { `) }) + test('with dpl query string', async () => { + const { css } = await nextFontLocalFontLoader({ + functionName: '', + deploymentId: 'dpl_123', + data: [{ src: './my-font.woff2' }], + emitFontFile: () => '/_next/static/media/my-font.woff2', + resolve: jest.fn(), + isDev: false, + isServer: true, + variableName: 'myFont', + loaderContext: { + fs: { + readFile: (_: string, cb: any) => cb(null, 'fontdata'), + }, + } as any, + }) + + expect(css).toMatchInlineSnapshot(` + "@font-face { + font-family: myFont; + src: url(/_next/static/media/my-font.woff2?dpl=dpl_123) format('woff2'); + font-display: swap; + } + " + `) + }) + test('Weight and style', async () => { const { css } = await nextFontLocalFontLoader({ functionName: '', From 05e49fb18454d714831d8732f3f420e62b1a49e7 Mon Sep 17 00:00:00 2001 From: Steven Date: Mon, 11 Aug 2025 11:41:29 -0400 Subject: [PATCH 4/4] Update packages/next/src/build/webpack-config.ts Co-authored-by: Tobias Koppers --- packages/next/src/build/webpack-config.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/next/src/build/webpack-config.ts b/packages/next/src/build/webpack-config.ts index f3a814c7ba590..12597dcaa57cb 100644 --- a/packages/next/src/build/webpack-config.ts +++ b/packages/next/src/build/webpack-config.ts @@ -2316,7 +2316,6 @@ export default async function getBaseWebpackConfig( basePath: config.basePath, excludeDefaultMomentLocales: config.excludeDefaultMomentLocales, assetPrefix: config.assetPrefix, - deploymentId: config.deploymentId, disableOptimizedLoading, isEdgeRuntime: isEdgeServer, reactProductionProfiling,