Transpile plyr import IE11 issue

[bennettfrazier]

Can a conditional option be added to configure support for IE11 with the build transpile as seen in this example: https://github.com/sampotts/plyr/issues/890#issuecomment-515765128?

replace import Plyr from 'plyr'; with... import Plyr from 'plyr/dist/plyr.polyfilled.js';

Currently plyr needs polyfill support for IE11 and with the vue-plyr component, I cannot get the dependency to work correctly unless someone knows of another way?

Note: I attempted to manually transpile the dependency in my nuxt config but did not seem to resolve..

build: {
    transpile: ['vue-plyr', 'plyr'],
    babel: {
      presets({ envName }) {
        const envTargets = {
          client: { browsers: ["last 2 versions"], ie: 11 },
          server: { node: "current" }
        }
        return [
          [
            "@nuxt/babel-preset-app",
            {
              targets: envTargets[envName]
            }
          ]
        ]
      }
    }
}

I am getting this error thrown in IE: Assignment to read-only properties is not allowed in strict mode

The transpile did however fix IE11 issues with arrow syntax and spread operator.

[IlyaSemenov]

@bennettfrazier you can fix it with:

build: {
  extend(config) {
    config.resolve.alias['plyr$'] = 'plyr/dist/plyr.polyfilled.js'
  },
},

[LavrovE]

same error

[oemueller]

same error, sadly this does not work:

build: { extend(config) { config.resolve.alias['plyr$'] = 'plyr/dist/plyr.polyfilled.js' }, }

[fac42]

Vue-Plyr is breaking on IE11 for me as well; I'm guessing it's because it's not using the polyfilled version of the plyr library. Not using nuxt like the other posters above. Could we get some help with this?

[redxtech]

I'll most likely deal with this by adding a direct copy of the component but using polyfilled plyr in an upcoming version. Thanks for letting me know!