npm i @oplayer/core @oplayer/ui @oplayer/hls hls.js

import OPlayer from '@oplayer/core'
import OUI from '@oplayer/ui'
import OHls from '@oplayer/hls'
 
OPlayer.make('#oplayer', {
  source: {
    title: '君の名は',
    src: 'https://cdn.jsdelivr.net/gh/shiyiya/QI-ABSL@master/o/君の名は.mp4',
    poster: 'https://cdn.jsdelivr.net/gh/shiyiya/QI-ABSL@master/o/poster.png'
  }
})
  .use([
    OUI({
      subtitle: {
        source: [
          {
            name: 'Japanese',
            default: true,
            src: 'https://cdn.jsdelivr.net/gh/shiyiya/QI-ABSL@master/o/君の名は-jp.srt'
          },
          {
            name: 'CH & JP',
            src: 'https://cdn.jsdelivr.net/gh/shiyiya/QI-ABSL@master/o/君の名は.srt'
          }
        ]
      },
      thumbnails: {
        src: 'https://cdn.jsdelivr.net/gh/shiyiya/QI-ABSL@master/o/thumbnails.jpg',
        number: 100
      }
    }),
    OHls({ forceHLS: true })
  ])
  .create()