运行Next.js开发服务器时出现Webpack缓存恢复失败警告求助

数据老陈

2026-8-1

Next.js开发服务器启动时webpack缓存恢复失败警告的原因与解决办法

原因分析

这个警告源于webpack的PackFileCacheStrategy在尝试读取.next/cache/webpack下的旧缓存包时出错，核心报错Cannot read properties of undefined (reading 'hasStartTime')指向缓存数据结构不兼容或缓存逻辑异常，常见触发场景：

Next.js实验性特性appDir的缓存逻辑存在版本适配bug
monorepo环境下，项目依赖树中webpack版本与Next.js内置webpack版本冲突
缓存文件本身因版本迭代导致结构损坏（即使删除.next后重新生成，仍可能因依赖版本问题重复出现）

解决办法

1. 统一webpack版本

Next.js内置了固定版本的webpack，若项目依赖树中存在其他版本的webpack，会导致缓存逻辑冲突。通过package.json强制锁定webpack版本：

npm用户：在package.json中添加overrides字段

{
  "overrides": {
    "webpack": "5.88.2" // 替换为你的Next.js对应webpack版本，可通过npm ls webpack查看
  }
}

yarn用户：在package.json中添加resolutions字段

{
  "resolutions": {
    "webpack": "5.88.2"
  }
}

执行npm install或yarn install重新安装依赖。

2. 调整webpack缓存策略

直接禁用webpack的pack缓存模式，改用内存或基础文件缓存：
在next.config.js中修改webpack配置：

/** @type {import('next').NextConfig} */
const nextConfig = {
  experimental: {
    appDir: true,
  },
  webpack: (config) => {
    config.cache = {
      type: 'filesystem',
      buildDependencies: { config: [__filename] },
      store: 'memory' // 改用内存缓存，避免pack文件读写问题
    };
    return config;
  },
};

module.exports = nextConfig;