Polymer and working with external JavaScript Libraries

Question

With Shadow DOM, I can easily use external CSS frameworks like bootstrap nicely and it will only apply to my scope which is nice (example here ).

However, this doesn't apply to JavaScript libraries as far as I know. If I, for example, need to work with jQuery on my web component, I basically make it available for entire page. What is the recommend way to work with external JavaScript libraries with Polymer? How should I handle cases where my web component (which is distributed through bower) needs one version of foo.js and the consumer needs another?

Answer 1

There is no JavaScript encapsulation solutions I know of.

1. Check if js encapsulation solutions exist, eg check zonejs and alternatives.
2. You may do it yourself but this will require you to devote some time to it. Eg I've encapsulated Babel with with statement as shown here (not tested).