在 Vercel 上渲染

可以在 Vercel 上渲染 Remotion 影片嗎？

不建議，且在大多數情況下無法正常運作。 Vercel 的 Serverless Function 有嚴格的執行環境限制，與 Remotion 的渲染需求不相容。

Vercel 有哪些限制導致無法渲染影片？

Vercel Serverless Function 的限制包括：

Remotion Lambda 和 Vercel 可以搭配使用嗎？

可以，這是推薦的組合。你可以：

• 使用 Vercel 部署 Next.js 前端和 API Routes
• 使用 Remotion Lambda（AWS Lambda）執行實際的影片渲染
• Next.js API Route 負責接收請求並呼叫 renderMediaOnLambda()

// pages/api/render.ts
import { renderMediaOnLambda } from "@remotion/lambda/client";
 
export default async function handler(req, res) {
  const { renderId, bucketName } = await renderMediaOnLambda({
    region: "us-east-1",
    functionName: process.env.REMOTION_FUNCTION_NAME,
    serveUrl: process.env.REMOTION_SERVE_URL,
    composition: "MyVideo",
    inputProps: req.body,
    codec: "h264",
  });
 
  res.json({ renderId, bucketName });
}

如果只是要預覽影片，可以在 Vercel 上使用 Remotion Player 嗎？

可以。@remotion/player 完全在客戶端（瀏覽器）中執行，不需要伺服器資源，因此可以在 Vercel 上正常部署和使用。這是在 Vercel 應用中展示 Remotion 影片的正確方式。

有辦法繞過 Vercel 的限制嗎？

沒有好的方法可以繞過。一些開發者嘗試過的方法及其問題：

1. 分割任務：將渲染分成多個短任務鏈接 — 複雜且不可靠
2. Edge Function：不支援 Node.js 原生模組，無法使用
3. 增加逾時設定：仍受 Vercel 計劃上限限制

最佳解決方案是使用專為影片渲染設計的基礎設施。

除了 Remotion Lambda，還有哪些替代方案？

Vercel 的 Edge Functions 可以用嗎？

不行。Edge Functions 執行在 V8 隔離環境中，無法使用 Node.js 原生模組、啟動子行程或存取檔案系統，而這些都是 Remotion 渲染所必需的。

詳情請參考 在 Edge 上渲染 文件。

如何在 Vercel 上設定 Remotion Lambda 的環境變數？

在 Vercel 控制台的「Settings > Environment Variables」中加入：

REMOTION_FUNCTION_NAME=remotion-render-xxxxx
REMOTION_SERVE_URL=https://your-s3-bucket.s3.amazonaws.com/sites/your-site/index.html
AWS_ACCESS_KEY_ID=your-access-key
AWS_SECRET_ACCESS_KEY=your-secret-key
AWS_REGION=us-east-1

注意：請勿將 AWS 憑證直接寫入程式碼，務必使用環境變數管理。

在 Vercel 上部署時出現「Module not found」錯誤怎麼辦？

這通常是因為 @remotion/renderer 嘗試引入 Node.js 原生模組。解決方法：

1. 確認你沒有在客戶端程式碼中 import @remotion/renderer
2. 在 next.config.js 中將這些模組標記為 external：

const nextConfig = {
  experimental: {
    serverComponentsExternalPackages: ["@remotion/renderer"],
  },
};

相關資源

• Remotion Lambda 設定指南
• 在 Next.js 中渲染
• 在 Edge 上渲染
• Vercel 官方文件