Remotion LabRemotion Lab
›工具›環境變數

環境變數

在 Remotion 專案中使用環境變數。

.env 檔案

Remotion 支援 .env 檔案。在專案根目錄建立 .env：

MY_API_KEY=sk-xxxxx
API_BASE_URL=https://api.example.com

在程式碼中使用

透過 process.env 存取：

const apiKey = process.env.MY_API_KEY;
const baseUrl = process.env.API_BASE_URL;

在 calculateMetadata 中使用

export const calculateMetadata = async () => {
  const response = await fetch(
    `${process.env.API_BASE_URL}/data`,
    {
      headers: {
        Authorization: `Bearer ${process.env.MY_API_KEY}`,
      },
    }
  );
  const data = await response.json();
  return { props: { data } };
};

CLI 傳入

MY_API_KEY=sk-xxxxx npx remotion render MyComp out/video.mp4

注意事項

  • .env 檔案不要提交到 Git（加入 .gitignore）
  • Remotion Studio 和渲染時都可以讀取 .env
  • 環境變數在打包時會被內聯，確保不要在前端暴露敏感資訊

小結

  • 用 .env 檔案管理 API 金鑰等設定
  • 透過 process.env 在程式碼中存取
  • 記得把 .env 加入 .gitignore