1

I've been struggling for a while to include a Plyr library (read & customise audio src) and I need to embed it via requireJS (important). all the other libraries work except this one, I wonder what's wrong!

Error: (console)

Uncaught TypeError: Plyr is not a constructor

Here is an example working without RequireJS, maybe it cool help. JsFiddle

My JsFiddle example :

html:

<audio crossorigin playsinline>
  <source src="https://cdn.plyr.io/static/demo/Kishi_Bashi_-_It_All_Began_With_a_Burst.mp3" type="audio/mp3">
  <source src="https://cdn.plyr.io/static/demo/Kishi_Bashi_-_It_All_Began_With_a_Burst.ogg" type="audio/ogg">
</audio>

Js:

requirejs.config({
    paths: {
        jquery: 'https://code.jquery.com/jquery-3.6.3.min',
        plyr: 'https://cdn.plyr.io/3.7.3/plyr'
    },
    shim: {
        "plyr": {
            deps: ["jquery"]
        }
    }
});

require(['jquery','plyr'], function($, Plyr) {
    'use strict';
        const player = new Plyr("audio", {});
        window.player = player;
});
isherwood
  • 58,414
  • 16
  • 114
  • 157
Bosee
  • 11
  • 2
  • `https://cdn.plyr.io/3.7.3/plyr` should probably be `https://cdn.plyr.io/3.7.3/plyr.js` – freedomn-m Feb 13 '23 at 18:47
  • @freedomn-m nope, we dont put the extensions in RequireJS. Thanks – Bosee Feb 13 '23 at 18:50
  • Possibly relevant: https://requirejs.org/docs/jquery.html#cdnconfig *Shim config does not work after optimization builds with CDN resources.* – freedomn-m Feb 15 '23 at 08:20
  • @freedomn-m Thanks for your help, I don't use cdn in my project (local source) and it doesn't work either, I put the CDN in my example to illustrate the need. – Bosee Feb 15 '23 at 17:01

0 Answers0