Remotion LabRemotion Lab
›音訊›匯出音訊

匯出音訊

從 Remotion 匯出純音訊檔案，或是在匯出影片時排除音訊軌道

從 Remotion 匯出影片時，音訊會自動包含在輸出結果中。此外，本頁說明如何僅匯出音訊、如何省略音訊，以及匯出流程的運作方式。

僅匯出音訊

支援匯出為 mp3、aac 和 wav 格式：

命令列

透過 CLI 匯出時，指定副檔名即可只渲染音訊：

npx remotion render src/index.ts my-comp out/audio.mp3

或使用 --codec 旗標自動選擇適合的輸出檔名：

npx remotion render src/index.ts my-comp --codec=mp3

renderMedia()

透過伺服器端渲染 API 僅渲染音訊時，使用 renderMedia() 並將 codec 設定為音訊編解碼器：

render.js
import {bundle} from '@remotion/bundler';
import {getCompositions, renderMedia} from '@remotion/renderer';
import path from 'path';
 
const compositionId = 'HelloWorld';
 
// 建立 Webpack bundle（只需執行一次，可重複使用）
const entry = './src/index';
console.log('正在建立影片的 Webpack bundle');
const bundleLocation = await bundle(path.resolve(entry), () => undefined, {
  // 如果您有 Webpack 覆寫設定，請在此加入
  webpackOverride: (config) => config,
});
 
// 透過傳入任意屬性來參數化影片
const inputProps = {
  foo: 'bar',
};
 
// 從 webpack bundle 中擷取所有已定義的合成
const comps = await getCompositions(bundleLocation, {
  inputProps,
});
 
// 選擇要渲染的合成
const composition = comps.find((c) => c.id === compositionId);
 
// 確保合成存在
if (!composition) {
  throw new Error(`找不到 ID 為 ${compositionId} 的合成。
  請檢查 "${entry}" 中的正確 ID。`);
}
 
const outputLocation = `out/${compositionId}.mp3`;
 
await renderMedia({
  composition,
  serveUrl: bundleLocation,
  codec: 'mp3',        // 設定為音訊編解碼器
  outputLocation,
  inputProps,
});

renderMediaOnLambda()

透過 Lambda 僅渲染音訊時，使用 renderMediaOnLambda() 並將 codec 設定為音訊編解碼器，同時將 imageFormat 設為 none：

lambda-render.ts
import {renderMediaOnLambda} from '@remotion/lambda';
 
const {bucketName, renderId} = await renderMediaOnLambda({
  region: 'us-east-1',
  functionName: 'remotion-render-bds9aab',
  composition: 'MyVideo',
  serveUrl: 'https://remotionlambda-qg35eyp1s1.s3.eu-central-1.amazonaws.com/sites/bf2jrbfkw',
  inputProps: {},
  codec: 'mp3',           // 音訊編解碼器
  imageFormat: 'none',    // 不需要截圖
});

renderMediaOnVercel()

透過 Vercel 僅渲染音訊時，使用 renderMediaOnVercel() 並將 codec 設定為音訊編解碼器，同時將 imageFormat 設為 none：

vercel-render.ts
// @module: es2022
// @target: es2022
import {renderMediaOnVercel, createSandbox} from '@remotion/vercel';
 
const sandbox = await createSandbox();
 
const {sandboxFilePath} = await renderMediaOnVercel({
  sandbox,
  compositionId: 'MyVideo',
  inputProps: {},
  codec: 'mp3',           // 音訊編解碼器
  imageFormat: 'none',    // 不需要截圖
});

Lambda CLI

使用 Lambda CLI 渲染時，使用 npx remotion lambda render 命令並傳入 --codec 旗標：

npx remotion lambda render \
  --codec=mp3 \
  https://remotionlambda-qg35eyp1s1.s3.eu-central-1.amazonaws.com/sites/bf2jrbfkw \
  my-comp

支援的音訊格式

格式特點適用場景
mp3最廣泛支援，有損壓縮一般用途，網路分發
aac現代有損格式，品質更佳Apple 裝置，串流平台
wav無損格式，檔案較大專業音訊後製

排除音訊

命令列

傳入 --muted 旗標可不匯出音訊：

npx remotion render --muted src/index.ts my-comp out/video.mp4

renderMedia()

向 renderMedia() 傳入 muted: true 可靜音渲染：

render-muted.js
import {bundle} from '@remotion/bundler';
import {getCompositions, renderMedia} from '@remotion/renderer';
import path from 'path';
 
const compositionId = 'HelloWorld';
const entry = './src/index';
 
const bundleLocation = await bundle(path.resolve(entry), () => undefined, {
  webpackOverride: (config) => config,
});
 
const inputProps = {foo: 'bar'};
 
const comps = await getCompositions(bundleLocation, {inputProps});
const composition = comps.find((c) => c.id === compositionId);
 
if (!composition) {
  throw new Error(`找不到 ID 為 ${compositionId} 的合成。`);
}
 
const outputLocation = `out/${compositionId}.mp4`;
 
await renderMedia({
  composition,
  serveUrl: bundleLocation,
  codec: 'h264',
  muted: true,           // 靜音渲染
  outputLocation,
  inputProps,
});

renderMediaOnLambda()

向 renderMediaOnLambda() 傳入 muted: true 可靜音渲染：

lambda-muted.ts
import {renderMediaOnLambda} from '@remotion/lambda';
 
const {bucketName, renderId} = await renderMediaOnLambda({
  region: 'us-east-1',
  functionName: 'remotion-render-bds9aab',
  composition: 'MyVideo',
  serveUrl: 'https://remotionlambda-qg35eyp1s1.s3.eu-central-1.amazonaws.com/sites/bf2jrbfkw',
  inputProps: {},
  codec: 'h264',
  muted: true,           // 靜音渲染
});

renderMediaOnVercel()

向 renderMediaOnVercel() 傳入 muted: true 可靜音渲染：

vercel-muted.ts
// @module: es2022
// @target: es2022
import {renderMediaOnVercel, createSandbox} from '@remotion/vercel';
 
const sandbox = await createSandbox();
 
const {sandboxFilePath} = await renderMediaOnVercel({
  sandbox,
  compositionId: 'MyVideo',
  inputProps: {},
  codec: 'h264',
  muted: true,           // 靜音渲染
});

Lambda CLI

向 npx remotion lambda render 傳入 --muted 旗標可靜音渲染：

npx remotion lambda render \
  --muted \
  https://remotionlambda-qg35eyp1s1.s3.eu-central-1.amazonaws.com/sites/bf2jrbfkw \
  my-comp

常見情境對比

情境方法主要設定
渲染含音訊的影片預設行為不需要特別設定
僅匯出音訊（MP3）CLI / renderMediacodec: 'mp3'
僅匯出音訊（WAV）CLI / renderMediacodec: 'wav'
渲染無聲影片CLI / renderMediamuted: true

相關連結