Simplify consuming this with webpack

[ropez]

See clappr/clappr-level-selector-plugin#40

[kslimani]

👍 @ropez could you edit this PR and do not modify files in dist folder ? (it may be one reason why it is not merged yet).

[ropez]

@kslimani updated

[maxlapshin]

so only merge this and it will work with webpack?

[kslimani]

@maxlapshin yes it should. Only part i am not sure is the peerDependencies field. Otherwise LGTM. (should work with Webpack, but also Browserify or any node modules compatible)

[ropez]

peerDependencies enures that, when this is installed as a dependency for another package, Clappr must also be a dependency of that package.

Before, with clappr as a dependency:

node_modules/clappr-level-selector-plugin
node_modules/clappr-level-selector-plugin/node_modules/clappr

After, with clappr as a peerDependency:

node_modules/clappr-level-selector-plugin
node_modules/clappr

Yes, this is working with webpack, assuming that the files in dist are updated when is merged. We have been using this branch as a dependency in our project since this PR was sent. (Actually, I think it will break now, since I've reverted the changed in dist)

[kslimani]

@ropez thank you for explanations. Maybe clappr should be set as dev dependency instead ? though, set as peerDependency, at worst it will only download clappr in node_modules folder.

[ropez]

Actually, npm doesn't download peerDependencies, it just prints out a big warning about missing ones.

I guess it makes sense to have Clappr as a devDependency. I just noticed that there is a development setup in public/index.html, which is using Clappr. In that case, webpack-dev-server is also missing.

However, since Clappr is not required for building (and consuming) this library, I don't think it should be a dependency.

[kslimani]

@ropez you are correct. Maybe simply remove Clappr from dependencies and change the clappr url in the demo/dev page to : https://cdn.jsdelivr.net/npm/clappr@latest/dist/clappr.min.js ?

[ropez]

I just remember why we had to remove Clappr from dependencies. Obviously, in our application using the level-selector, we also have Clappr as a dependency. We ended up with two instances of Clappr in our webpack-build bundle:

node_modules/clappr
node_modules/clappr-level-selector-plugin/node_modules/clappr

These instances would conflict, causing strange and buggy behaviour in our application.

[kslimani]

I see 2 scenarios to resolve this issue :

• The first is to remove clappr from dependencies and change url in demo/dev page to jsDeliver url. (the easy way)

• The second is to add clappr as dev dependency and serve it by Webpack dev server in demo/dev page. (add dev server configuration in webpack config, see this example)

[wmucheru]

Hey guys, is this ready to merge? I was looking for a way to npm install clappr-selector-plugin and this would really help me out

[leandromoreira]

@clappr/core can any of you have a double check?

[mgambati]

any news on this?