Next.js localFont函数生产环境Docker构建失败报错

环境信息 #

• Node.js：22.2.0
• Next.js：14.2.4
• Yarn：4.2.2
• 部署方式：Docker

代码实现 #

layout.tsx 字体配置 #

import localFont from 'next/font/local';

const content = localFont({
  src: [
    {
      path: './fonts/light.woff2',
      weight: '300',
      style: 'normal',
    },
    {
      path: './fonts/regular.woff2',
      weight: '400',
      style: 'normal',
    },
    {
      path: './fonts/bold.woff2',
      weight: '700',
      style: 'normal',
    },
  ],
  display: 'swap',
  variable: '--font-content',
  fallback: ['system-ui', 'arial'],
  adjustFontFallback: 'Times New Roman',
});

tailwind.config.js 字体族配置 #

fontFamily: {
    content: ['var(--font-content)'],
}

构建错误日志 #

#16 1.452   ▲ Next.js 14.2.4
#16 1.452 
#16 1.524    Creating an optimized production build ...
#16 8.896 Failed to compile.
#16 8.896 
#16 8.900 src/app/layout.tsx
#16 8.900 An error occurred in `next/font`.
#16 8.900 
#16 8.900 TypeError: Cannot read properties of undefined (reading 'ascent')
#16 8.900     at get ascent (/app/node_modules/next/dist/compiled/@next/font/dist/fontkit/index.js:1:797933)
#16 8.900     at getFallbackMetricsFromFontFile (/app/node_modules/next/dist/compiled/@next/font/dist/local/get-fallback-metrics-from-font-file.js:73:13)
#16 8.900     at nextFontLocalFontLoader (/app/node_modules/next/dist/compiled/@next/font/dist/local/loader.js:63:114)
#16 8.900     at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
#16 8.900     at async Span.traceAsyncFn (/app/node_modules/next/dist/trace/trace.js:154:20)
#16 8.900     at async /app/node_modules/next/dist/build/webpack/loaders/next-font-loader/index.js:76:87
#16 8.900     at async Span.traceAsyncFn (/app/node_modules/next/dist/trace/trace.js:154:20)

已尝试操作 #

• 调整fallback和adjustFontFallback的不同取值，构建仍报错
• 本地环境（版本与Docker完全一致）下运行、构建均正常

内容的提问来源于stack exchange，提问作者Niks