You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Turbopack Monorepo中next/font/google报错,添加@next/font仍无效求助

Turborepo中Next.js 13.0.4的next/font导入错误:原因与修复方案

问题原因

  1. 早期Next.js版本的Monorepo解析bug:Next.js 13.0.4属于13.x早期版本,在Turborepo这类Monorepo场景下,内置next/font模块的路径解析存在bug,导致系统错误提示需导入@next/font而非内置的next/font。
  2. 依赖版本不匹配:手动安装@next/font后,若该包版本与项目使用的Next.js 13.0.4不一致,会引发模块冲突,无法正常加载字体功能。
  3. Turborepo依赖干扰:Turborepo的依赖提升机制可能让web工作区加载了全局的next包而非自身工作区的版本,导致内置字体模块无法被正确识别。

修复方案

方案1:修复依赖配置与导入(适配13.0.4版本)

  • 移除web工作区package.json中手动添加的@next/font依赖(Next.js 13.0.4中next/font是内置模块,无需单独安装)。
  • 保持_app.tsx中的官方导入写法不变:
    import { Inter } from 'next/font/google'
    const inter = Inter({ subsets: ['latin'] })
    
  • 清理并重新安装依赖:
    1. 删除项目根目录和web工作区的node_modules文件夹。
    2. 在根目录执行pnpm install(或对应包管理器的安装命令,如npm install/yarn install)。
    3. 重启turbo dev开发服务器。

方案2:禁用特定依赖的提升

在项目根目录的turbo.json中添加配置,禁止next和@next/*包的依赖提升,确保web工作区使用自身的Next.js版本:

{
  "packageManager": "pnpm@7.15.0", // 根据你的包管理器调整
  "pipeline": {
    // 保留原有pipeline配置
  },
  "npmClientArgs": ["--no-hoist=next", "--no-hoist=@next/*"]
}

执行依赖重装后重启开发服务器即可。

方案3:升级Next.js版本(推荐长期解决)

13.0.x早期版本存在较多Monorepo相关问题,升级到13.1及以上版本可彻底解决这类路径解析bug:

  • 同步更新根目录和web工作区package.json中的Next.js版本为^13.1.0或更高稳定版。
  • 执行根目录的依赖安装命令,确保所有工作区依赖版本一致。
  • 重启开发服务器后,使用官方默认的next/font/google导入写法即可正常运行。

内容的提问来源于stack exchange,提问作者Rusty

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.24 11:05:26