New Patch, Merge?

    @mux/mux-player-react
    TypeScript icon, indicating that this package has built-in type declarations

    1.7.1 • Public • Published

    <MuxPlayer/>

    Downloads Version License

    Introduction

    <MuxPlayer /> is a Mux-flavored React video player component, built on top of our mux-player web component and Media Chrome.

    Installation

    npm install @mux/mux-player-react

    or

    yarn add @mux/mux-player-react

    Usage

    import MuxPlayer from '@mux/mux-player-react';
    
    <MuxPlayer
      playbackId="DS00Spx1CV902MCtPj5WknGlR102V5HFkDe"
      metadata={{
        video_id: 'video-id-123456',
        video_title: 'Bick Buck Bunny',
        viewer_user_id: 'user-id-bc-789',
      }}
      streamType="on-demand"
    />;

    Lazy-loading

    Defer loading of Mux Player by importing from @mux/mux-player-react/lazy.

    import MuxPlayer from '@mux/mux-player-react/lazy';
    
    <MuxPlayer
      loading="viewport"
      playbackId="DS00Spx1CV902MCtPj5WknGlR102V5HFkDe"
      metadata={{
        video_id: 'video-id-123456',
        video_title: 'Bick Buck Bunny',
        viewer_user_id: 'user-id-bc-789',
      }}
      streamType="on-demand"
    />;

    If you are generating your pages with a Node.js server (for example, Next.js), consider using @mux/mux-player-react/lazy with @mux/blurhash to generate a placeholder to display during loading.

    Docs

    Docs and guides live on docs.mux.com.

    API reference lives on Github.

    Keywords

    none

    Install

    npm i @mux/mux-player-react

    DownloadsWeekly Downloads

    7,583

    Version

    1.7.1

    License

    MIT

    Unpacked Size

    121 kB

    Total Files

    31

    Last publish

    Collaborators

    • mux-npmjs