I’m using Next.js 15.2.3 with static export (next build && next export) and deploying it to AWS S3, serving it through CloudFront. Everything works fine on the first deployment.

However, when I update my code, rebuild, sync the new files to S3, and invalidate the CloudFront cache, users sometimes see .txt files when navigating between routes instead of the expected content.

# Upload files to S3 bucket
aws s3 sync "$OUT_DIR" "s3://$BUCKET/" --cache-control "max-age=31536000, public"

# Process HTML files: create extensionless copies
find "$OUT_DIR" -type f -name "*.html" -exec bash -c '
  file_path="$1"
  relative_path="${file_path#out/}"
  file_name="${relative_path%.html}"

  aws s3 cp "s3://$BUCKET/$relative_path" "s3://$BUCKET/$file_name" \
    --metadata-directive REPLACE \
    --cache-control "max-age=31536000, public" \
    --content-type "text/html"
' _ {} \;

# Invalidate CloudFront cache
aws cloudfront create-invalidation --distribution-id "$DISTRIBUTION_ID" --paths "/*"