Skip to main content

TypeScript 类型参考

warning

非常实验性的功能——随时可能出现错误和重大更改。 在 GitHub 上跟踪进度 并在 Discord 的 #web-renderer 通道讨论。

以下类型是 @remotion/web-renderer 的 API 的一部分：

🌐 The following types are part of the API of @remotion/web-renderer:

WebRendererContainer​

import type {WebRendererContainer} from '@remotion/web-renderer';
                      
(alias) type WebRendererContainer = "mp4" | "webm"
import WebRendererContainer

将来可能会添加更多值，这不会被视为破坏性更改。

🌐 More values may be added in the future, this would not be considered a breaking change.

WebRendererVideoCodec​

import type {WebRendererVideoCodec} from '@remotion/web-renderer';
                      
(alias) type WebRendererVideoCodec = "h264" | "h265" | "vp8" | "vp9" | "av1"
import WebRendererVideoCodec

将来可能会添加更多值，这不会被视为破坏性更改。

🌐 More values may be added in the future, this would not be considered a breaking change.

WebRendererAudioCodec​

import type {WebRendererAudioCodec} from '@remotion/web-renderer';
                      
(alias) type WebRendererAudioCodec = "aac" | "opus"
import WebRendererAudioCodec

将来可能会添加更多值，这不会被视为破坏性更改。

🌐 More values may be added in the future, this would not be considered a breaking change.

WebRendererQuality​

import type {WebRendererQuality} from '@remotion/web-renderer';
                     
(alias) type WebRendererQuality = "very-low" | "low" | "medium" | "high" | "very-high"
import WebRendererQuality

WebRendererOutputTarget​

import type {WebRendererOutputTarget} from '@remotion/web-renderer';
                       
(alias) type WebRendererOutputTarget = "arraybuffer" | "web-fs"
import WebRendererOutputTarget
  • 'arraybuffer'：将输出作为内存中的 Blob 返回
  • 'web-fs'：使用 文件系统访问 API 写入文件

FrameRange​

import type {FrameRange} from '@remotion/web-renderer';
                 
(alias) type FrameRange = number | [number, number] | [number, null]
import FrameRange
  • 一个数字只呈现那一帧
  • 一个元组 [start, end] 渲染从 start 到 end（包括）帧
  • 一个元组 [start, null] 从 start 渲染到作曲的结束 v4.0.421

RenderStillOnWebImageFormat​

import type {RenderStillOnWebImageFormat} from '@remotion/web-renderer';
                         
(alias) type RenderStillOnWebImageFormat = "png" | "jpeg" | "webp"
import RenderStillOnWebImageFormat

RenderMediaOnWebProgress​

import type {RenderMediaOnWebProgress} from '@remotion/web-renderer';
                        
(alias) type RenderMediaOnWebProgress = {
    renderedFrames: number;
    encodedFrames: number;
}
import RenderMediaOnWebProgress
  • renderedFrames：已渲染的帧数
  • encodedFrames：已编码的帧数

RenderMediaOnWebProgressCallback​

import type {RenderMediaOnWebProgressCallback} from '@remotion/web-renderer';
                            
(alias) type RenderMediaOnWebProgressCallback = (progress: RenderMediaOnWebProgress) => void
import RenderMediaOnWebProgressCallback

RenderMediaOnWebResult​

import type {RenderMediaOnWebResult} from '@remotion/web-renderer';
                       
(alias) type RenderMediaOnWebResult = {
    getBlob: () => Promise<Blob>;
    internalState: InternalState;
}
import RenderMediaOnWebResult
  • getBlob()：返回一个包含渲染视频的 Promise<Blob>
  • internalState：内部状态对象（非公开使用）

RenderMediaOnWebOptions​

import type {RenderMediaOnWebOptions} from '@remotion/web-renderer';
                       
(alias) type RenderMediaOnWebOptions<Schema extends $ZodObject, Props extends Record<string, unknown>> = MandatoryRenderMediaOnWebOptions<Schema, Props> & Partial<OptionalRenderMediaOnWebOptions<Schema>> & InputPropsIfHasProps<Schema, Props>
import RenderMediaOnWebOptions

RenderStillOnWebOptions​

import type {RenderStillOnWebOptions} from '@remotion/web-renderer';
                       
(alias) type RenderStillOnWebOptions<Schema extends $ZodObject, Props extends Record<string, unknown>> = {
    frame: number;
    imageFormat: RenderStillOnWebImageFormat;
} & {
    composition: CompositionCalculateMetadataOrExplicit<Schema, Props>;
} & Partial<OptionalRenderStillOnWebOptions<Schema>> & InputPropsIfHasProps<Schema, Props>
import RenderStillOnWebOptions

CanRenderMediaOnWebOptions​

import type {CanRenderMediaOnWebOptions} from '@remotion/web-renderer';
                         
(alias) type CanRenderMediaOnWebOptions = {
    container?: WebRendererContainer;
    videoCodec?: WebRendererVideoCodec;
    audioCodec?: WebRendererAudioCodec | null;
    width: number;
    height: number;
    transparent?: boolean;
    muted?: boolean;
    videoBitrate?: number | WebRendererQuality;
    audioBitrate?: number | WebRendererQuality;
    outputTarget?: WebRendererOutputTarget | null;
}
import CanRenderMediaOnWebOptions

CanRenderMediaOnWebResult​

import type {CanRenderMediaOnWebResult} from '@remotion/web-renderer';
                        
(alias) type CanRenderMediaOnWebResult = {
    canRender: boolean;
    issues: CanRenderIssue[];
    resolvedVideoCodec: WebRendererVideoCodec;
    resolvedAudioCodec: WebRendererAudioCodec | null;
    resolvedOutputTarget: WebRendererOutputTarget;
}
import CanRenderMediaOnWebResult
  • canRender：渲染是否可以执行
  • issues：一个 CanRenderIssue 对象的数组
  • videoCodec：已解析的视频编解码器
  • audioCodec：已解析的音频编解码器
  • outputTarget：已解析的输出目标

CanRenderIssue​

import type {CanRenderIssue} from '@remotion/web-renderer';
                   
(alias) type CanRenderIssue = {
    type: CanRenderIssueType;
    message: string;
    severity: "error" | "warning";
}
import CanRenderIssue
  • type：问题类型（例如：'video-codec-unsupported'、'webcodecs-unavailable'）
  • message：对该问题的可人类阅读的描述
  • severity：要么 'error' 要么 'warning'

EmittedArtifact​

import type {EmittedArtifact} from '@remotion/web-renderer';
                   
(alias) type EmittedArtifact = {
    filename: string;
    content: string | Uint8Array;
    frame: number;
    downloadBehavior: DownloadBehavior | null;
}
import EmittedArtifact
  • filename：工件文件的名称
  • content：该工件的内容作为 string 或 Uint8Array
  • frame：触发伪影的帧编号
  • downloadBehavior：该如何处理工件以供下载

WebRendererOnArtifact​

import type {WebRendererOnArtifact} from '@remotion/web-renderer';
                      
(alias) type WebRendererOnArtifact = (asset: EmittedArtifact) => void
import WebRendererOnArtifact

OnFrameCallback​

import type {OnFrameCallback} from '@remotion/web-renderer';
                   
(alias) type OnFrameCallback = (frame: VideoFrame) => VideoFrame | Promise<VideoFrame>
import OnFrameCallback

一个回调函数，它接收每个渲染的 VideoFrame 并可以在编码前对其进行转换。

🌐 A callback that receives each rendered VideoFrame and can transform it before encoding.

GetEncodableVideoCodecsOptions​

import type {GetEncodableVideoCodecsOptions} from '@remotion/web-renderer';
                           
(alias) type GetEncodableVideoCodecsOptions = {
    videoBitrate?: number | WebRendererQuality;
}
import GetEncodableVideoCodecsOptions

GetEncodableAudioCodecsOptions​

import type {GetEncodableAudioCodecsOptions} from '@remotion/web-renderer';
                           
(alias) type GetEncodableAudioCodecsOptions = {
    audioBitrate?: number | WebRendererQuality;
}
import GetEncodableAudioCodecsOptions
Last updated on