Next.js项目构建目录(.next)体积增长问题咨询

.next/cache体积增至85MB是否正常？ #

这属于开发过程中的正常现象。.next/cache目录是Next.js用来存储构建缓存的地方，包含依赖预构建结果、编译后的组件缓存、静态资源缓存等内容。随着开发中新增组件、引入依赖或频繁修改代码，缓存会逐步累积，体积自然增长。只要你所有路由的首屏加载JS都保持在100KB以下，说明生产构建的实际交付资源是健康的，缓存体积大只是开发阶段的临时状态，不用过度担忧生产环境的资源体积。

防止.cache体积持续增大的建议 #

• 定期清理缓存：执行npm run build --clean命令，或者直接手动删除.next/cache目录，Next.js会在下次构建时重新生成必要的缓存，完全不影响开发流程。
• 排查冗余资源：如果缓存增长异常快，检查下是否引入了体积过大的依赖，或者代码里有没有未优化的大静态资源（比如未压缩的高清图片），这类资源会被缓存导致体积激增。
• 按需调整缓存配置：在next.config.js中可以通过experimental.cacheMemoryCacheSize等选项限制内存缓存的大小，但一般开发阶段不需要额外配置，定期清理就足够解决问题。

output: 'export'生成的out文件夹使用方法 #

当你在next.config.js中设置output: 'export'后，Next.js会生成纯静态的HTML、CSS和JS文件，全部存放在out目录中，使用方式如下：

• 本地预览：用静态文件服务器启动，比如执行npx serve out，就能在本地直接预览整个静态站点。
• 部署到静态托管平台：直接把out目录的所有内容上传到任何静态网站托管服务，不需要依赖Node.js服务器，因为所有内容都是预渲染完成的静态资源。
• 注意适用场景：这种静态导出模式不支持Server Components、API Routes、增量静态再生（ISR）等需要服务器支持的特性，如果你的项目用到了这些功能，就不能使用该模式，否则会出现报错。

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