如何在不执行压缩优化的情况下完成Next.js构建与导出

第一步：修改根目录下的next.config.js配置 #

添加以下配置项，覆盖默认的优化规则：

/** @type {import('next').NextConfig} */
const nextConfig = {
  // 关闭内置的gzip压缩
  compress: false,
  // 关闭SWC编译器的代码压缩（Next.js 12+默认用SWC）
  swcMinify: false,
  // 若使用Terser压缩器，添加以下配置关闭压缩和变量混淆
  terser: {
    compress: false,
    mangle: false,
  },
  // 关闭CSS压缩
  experimental: {
    cssMinify: false,
  },
  // 关闭图片自动优化
  images: {
    unoptimized: true,
  },
  // 开启静态导出（如果需要导出纯静态文件）
  output: 'export',
}

module.exports = nextConfig

如果项目配置了自定义webpack规则，需要手动移除webpack配置中的TerserPlugin、CssMinimizerPlugin等压缩插件的引入。

第二步：执行构建和导出命令 #

直接运行项目的构建命令即可，无需额外加参数：

• 用npm执行：npm run build
• 用yarn执行：yarn build
• 用pnpm执行：pnpm build
  构建完成后如果配置了output: 'export'，导出的未压缩静态文件会存放在根目录的out文件夹下。

注意：如果使用的是Next.js 12之前的旧版本，不需要配置output: 'export'，执行完next build后再手动执行next export命令即可完成静态导出。

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