如何修改NextJS缓存文件夹位置？多前端应用需共享缓存

完全可以修改Next.js的默认缓存目录（.next/cache），针对你多应用共享缓存的需求，这里提供两种可行方案：

1. 使用环境变量快速修改路径 #

Next.js 13.4及以上版本支持通过NEXT_CACHE_DIR环境变量直接指定缓存目录路径，这是最简单的实现方式：

• 临时生效：在启动或构建命令前添加环境变量，比如：

  NEXT_CACHE_DIR=/shared/next-cache npm run build
  NEXT_CACHE_DIR=/shared/next-cache npm run start
  

• 持久生效：在项目根目录的.env或.env.production文件中配置：

  NEXT_CACHE_DIR=/shared/next-cache
  

2. 自定义缓存处理器（进阶场景） #

如果需要更复杂的缓存逻辑（比如分布式共享缓存），可以在next.config.js中配置experimental.cacheHandler来自定义缓存实现：

/** @type {import('next').NextConfig} */
const nextConfig = {
  experimental: {
    cacheHandler: require.resolve('./custom-cache-handler.js'),
  },
}

module.exports = nextConfig

你可以在custom-cache-handler.js中实现基于共享存储（比如网络文件系统、分布式缓存服务）的缓存逻辑，不过如果只是单纯修改路径，第一种方法足够满足需求。

多应用共享缓存的注意事项 #

• 权限配置：确保所有部署的前端应用进程都拥有共享缓存目录的读写权限，避免因权限不足导致缓存读写失败。
• 版本兼容性：建议只有使用相同Next.js版本、依赖包版本的应用共享缓存，不同版本的缓存结构可能不兼容，引发构建或运行异常。
• 缓存清理：定期清理过期或无用的缓存文件，防止共享目录占用过多磁盘空间，可配合系统定时任务或Next.js内置的缓存失效机制实现。

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