vime-js / vime

Customizable, extensible, accessible and framework agnostic media player. Modern alternative to Video.js and Plyr. Supports HTML5, HLS, Dash, YouTube, Vimeo, Dailymotion...
https://vimejs.com
MIT License
2.75k stars 154 forks source link

Not compatible with Svelte 4... #371

Open rchrdnsh opened 1 year ago

rchrdnsh commented 1 year ago

Get the following errors when trying to install the svelte bindings for a sveltekit project using svelte 4:

rchrdnsh@RN lstv % npm i @vime/core @vime/svelte
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: lstv@0.0.1
npm ERR! Found: svelte@4.0.0
npm ERR! node_modules/svelte
npm ERR!   dev svelte@"^4.0.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer svelte@"^3.0.0" from @vime/svelte@5.4.0
npm ERR! node_modules/@vime/svelte
npm ERR!   @vime/svelte@"*" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! 
npm ERR! For a full report see:
npm ERR! /Users/rchrdnsh/.npm/_logs/2023-06-23T17_12_11_315Z-eresolve-report.txt

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/rchrdnsh/.npm/_logs/2023-06-23T17_12_11_315Z-debug-0.log
rchrdnsh@RN lstv % 

please test and update dependencies accordingly.

Thank you!

fcidade commented 1 year ago

I had the same issue today. Running npm i @vime/svelte --force worked but is not ideal.

labriola commented 1 year ago

I created a PR that could be reviewed and appears to fix the issue:

https://github.com/vime-js/vime/pull/373

I have some minimal local testing but because of the way this package is nested for deploy it's not super easy to just test with npm. Extra eyes are always appreciated on this but maybe we can get it merged if it works

caschbre commented 10 months ago

I also started to receive the following typescript issues while attempting to use this with svelte 4.

Argument of type 'typeof Video' is not assignable to parameter of type 'ConstructorOfATypedSvelteComponent'.
  Types of construct signatures are incompatible.
    Type 'new (options: any) => Video' is not assignable to type 'new (args: { target: any; props?: any; }) => ATypedSvelteComponent'.
      Construct signature return types 'Video' and 'ATypedSvelteComponent' are incompatible.
        The types of '$on' are incompatible between these types.
          Type '<K extends never>(type: K, callback: (e: VmVideoEvents[K]) => any) => () => void' is not assignable to type '(event: string, handler: ((e: any) => any) | null | undefined) => () => void'.
            Types of parameters 'callback' and 'handler' are incompatible.
              Type '((e: any) => any) | null | undefined' is not assignable to type '(e: never) => any'.
                Type 'undefined' is not assignable to type '(e: never) => any'.

Possible causes:
- You use the instance type of a component where you should use the constructor type
- Type definitions are missing for this Svelte Component. If you are using Svelte 3.31+, use SvelteComponentTyped to add a definition:
  import type { SvelteComponentTyped } from "svelte";
  class ComponentName extends SvelteComponentTyped<{propertyName: string;}> {}