Fix https://github.com/farbelous/bootstrap-colorpicker/issues/272

itsjavi / bootstrap-colorpicker

Bootstrap Colorpicker is a modular color picker plugin for Bootstrap.

https://itsjavi.com/bootstrap-colorpicker/

MIT License

1.38k stars 367 forks source link

Fix https://github.com/farbelous/bootstrap-colorpicker/issues/272 #292

Closed alfredopenaalonso closed 5 years ago

alfredopenaalonso commented 5 years ago

Description

Change how jQuery is imported by webpack to fix https://github.com/farbelous/bootstrap-colorpicker/issues/272

Check list

Please fill this check list before submitting a pull request:

[x] The build process has been run (npm run build) and does not contain any errors.
[x] All tests are green after running npm run test.
[x] New tests have been added or modified for the introduced changes. (No test added, only an error on npm compilation have been fixed)
[x] New examples have been added for the newly introduced features. (No examples needed, only an error on npm compilation have been fixed)
[x] All the examples are still working as expected compared to the official website.
[x] This PR follows all other CONTRIBUTING.md guidelines for Pull Requests.

itsjavi commented 5 years ago

hi, did you try the plugin in the browser after your changes? I think it will not work, as happened in a previous PR

alfredopenaalonso commented 5 years ago

Yes, I've try making the change, running the build, and use this build inside node_modules folder in a Symfony 4 app.

After that, I've run yarn encore dev and yarn encore prod and the compilations goes OK without showing any warnigs, and the color picker component works well in the front end.

If you could give me more details about how to reproduce the error found on the other PR I will be glad to check if it's OK.

alfredopenaalonso commented 5 years ago

Sorry, running yarn encore on windows works OK, running it on linux makes it fail on the browser... I will check it

itsjavi commented 5 years ago

To test if it really works in the browser, you need to use the files under the dist folder after running npm run build in this project, as specified in the contributing guidelines: https://github.com/farbelous/bootstrap-colorpicker/blob/master/.github/CONTRIBUTING.md

itsjavi commented 5 years ago

https://github.com/farbelous/bootstrap-colorpicker/blob/master/.github/CONTRIBUTING.md#pull-requests

alfredopenaalonso commented 5 years ago

Sorry, as I said before, I tested dist folder with a Symfony project (includes the JS using encore) and here it worked well, but on explorer it doesn't...

I've been searching, and seems to be a issue about the external import of jQuery. According to this: https://stackoverflow.com/a/34254167, different names are required in each module definition.

I've made the changes in webpack.config.js. Now I've been testing in browser and it's working OK, I've also tested the dist folder inside a Symfony project and the error "There are multiple modules with names that only differ in casing" now doesn't appears and it's working fine.

I think that the issue https://github.com/farbelous/bootstrap-colorpicker/issues/272 is fixed and everything seems to be working as before.

itsjavi commented 5 years ago

that's cool, I appreciate a lot your help. going to merge it and release a new version today