react-player-blue-billywig

This GitHub-hosted NPM package extends ReactPlayer, enabling you to embed Blue Billywig content (media clips, projects, playlists) in a React web application.

Add to package.json

``
"dependencies": {
"react": "^18.0.0",
"react-player": "^2.16.0",
"react-player-blue-billywig": "^8.17.0"
}
`

Import and Register the Extension

`
import React from 'react';
import ReactPlayer from 'react-player';
import ReactPlayerBlueBillywig from 'react-player-blue-billywig';
ReactPlayer.addCustomPlayer(ReactPlayerBlueBillywig);
`

Embedding

Embed Blue Billywig content using the JSON embed code provided by the Online Video Platform's Preview page.
`

`

Troubleshooting

If the player doesn't load as expected, try including the following script in your HTML as a workaround:
`

`

If you're using React Router (v7), you may need to add a type declaration, for instance:
`
[missingtypes.d.ts]
declare module 'react-player-blue-billywig'
`
Further, it may help to check existence of ReactPlayer.addCustomPlayer before calling it;
`
if (ReactPlayer.addCustomPlayer) ReactPlayer.addCustomPlayer(ReactPlayerBlueBillywig);
`

If you're using Next.js (App Router), you may need to add
`
'use client'
``
to the top of the file that contains your <ReactPlayer> tag.