An imgix video custom element for React
npm install @imgix/ix-player-react is the official imgix React video player component, built on top of our ix-player web component and Media Chrome.
``shell`
npm install @imgix/ix-player-react
or
`shell`
yarn add @imgix/ix-player-react
`jsx
import IxPlayer from '@imgix/ix-player-react';
type="hls"
/>;
`
Defer loading of IxPlayer by importing from @imgix/ix-player-react/lazy.
`jsx
import IxPlayer from '@imgix/ix-player-react/lazy';
src="https://assets.imgix.video/videos/alexa_ski_big_bear_mountain.MOV?fm=hls"
type="hls"
gifPreview
posterParams="video-thumbnail-time=2"
/>;
`
If you are generating your pages with a Node.js server (for example, Next.js), consider using @imgix/ix-player-react/lazy with a blurhash library and imgix Video API's video-generate` parameter to generate a placeholder to display during loading.
API reference lives on Github.