Clappr
August 11, 2026 · View on GitHub
An extensible, plugin-oriented, HTML5-first media player for the web.
It provides a modular architecture to build powerful playback experiences with ease.
Getting Started
Install via npm or yarn:
yarn add @clappr/player
Breaking changes (playback peers)
Recent majors stopped embedding their streaming libraries — you must provide the peer:
| Package | Major | Change |
|---|---|---|
@clappr/hlsjs-playback | 3.0.0 | hls.js no longer bundled |
dash-shaka-playback | 5.0.0 | shaka-player no longer bundled |
Project Structure
This repository uses a monorepo layout:
| Directory | Description |
|---|---|
/apps | Applications such as clappr.io and documentation site |
/packages | Core packages (e.g. @clappr/player, plugins, utilities) |
/packages/player | The main Clappr Player package. Exposes the public API and serves as the entry point for embedding the player in web apps. |
/packages/clappr-core | Contains the core architecture of the player — including components such as Core, Container, and Playback abstractions. |
/packages/clappr-plugins | Official plugin collection, providing ready-to-use extensions (e.g., UI features, analytics integrations). |
/packages/clappr-zepto | Lightweight DOM utility layer, a modernized fork of Zepto tailored for Clappr’s internal UI rendering. |
/packages/hlsjs-playback | Playback module that adds support for HLS streams using hls.js. |
/packages/dash-shaka-playback | Playback module that enables MPEG-DASH streaming via Shaka Player. |
/packages/html5-tvs-playback | Playback module for HbbTV smart TVs, supporting VoD/Live and DRM via the OIPF DRM agent. |
Documentation
For the latest guides, examples, and architecture overviews, visit the resources below:
- Getting Started: quick setup and integration examples.
- Architecture Overview: explains how the player, core, containers, and plugins interact.
- Plugin Development Guide: how to create and register custom plugins.
- Player API Reference: complete reference of all available Player methods and properties.
- Frequently Asked Questions: answers to commonly asked questions about setup, configuration, and troubleshooting.
- Changelog: highlights of each version and breaking changes.
Local Development
Requires Node.js ≥ 24. The repo pins the major version in .nvmrc; with nvm, run nvm install then nvm use in the project root before any yarn command. Yarn 1 aborts every yarn command when the engine check fails.
Clone the repository and run:
# Install dependencies
yarn install
# Start the development environment
yarn dev
# Open in your browser
http://localhost:8080
Contributing
We welcome contributions. See CONTRIBUTING.md for how to report bugs, propose features, and submit pull requests. Please follow our Code of Conduct.
Contributors
Thanks to all our amazing contributors! 🎉
See the full list on our contributors page.
Security
Found a vulnerability? Please do not open a public issue — see our Security Policy for how to report it privately and what falls in scope.
License
BSD-3-Clause © Globo.com