在Fleek部署Next.js：保留API路由、生成静态HTML及部署排障

1. 不用next export能不能同时生成静态HTML并保留API路由？ #

明确说：不行。

next export是Next.js官方唯一能生成纯静态HTML包的方式，但它会直接禁用API路由——原因很简单：API路由依赖Node.js运行时来执行服务器端代码，纯静态环境根本跑不了这些逻辑。

如果想同时保留预生成的静态HTML（比如SSG页面）和API路由，得用Next.js的标准服务器部署模式：

• 执行next build构建项目，生成.next目录
• 用next start启动本地服务器，或者把.next目录部署到支持Next.js runtime的平台
• 这种模式下，SSG页面会被预编译成静态HTML，API路由也能正常工作，因为平台会提供Node.js环境支撑。

2. Fleek部署Next.js的坑点解决 #

Fleek本质是纯静态站点托管，直接部署Next.js容易出问题，针对你遇到的两种情况：

问题1：部署后显示文件夹结构而非页面 #

• 先确认启用next export模式：在next.config.js里添加配置：

  /** @type {import('next').NextConfig} */
  const nextConfig = {
    output: 'export',
  }
  module.exports = nextConfig
  

• 执行npm run build，会生成out目录，把Fleek的部署输出目录设为out，而非项目根目录——根目录文件杂乱，Fleek无法识别正确的页面入口。

问题2：构建时提示找不到public目录 #

• 先检查项目根目录是否存在public文件夹，注意大小写（Next.js对目录名大小写敏感，别写成Public）
• 若确实没有，直接创建一个空的public目录——Next.js默认会读取该目录下的静态资源，哪怕是空的也不能缺失
• 检查next.config.js里有没有修改public目录路径的配置（比如assetPrefix），确保路径配置正确。

需保留API路由的替代方案 #

Fleek的纯静态环境无法运行API路由，给两个可行方向：

• 把API路由迁移到外部无服务器函数服务，在Next.js里通过HTTP请求调用这些外部接口
• 更换到支持Next.js服务器运行的托管平台，比如Vercel、Netlify、Render等。

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