Search code examples
web-component

Developing web components with external dependencies?


I would like to create a web component which is an auto-complete combobox, but since there is no such thing natively, is it considered bad practise to make a web component which also depends on a third party library or libraries?

I've only had some minor involvement with Polymer a year ago, and now that v1 of the spec is out, I'm looking at them again. It seems to me that most people develop web components that are 100% plain javascript with no external dependencies, but given the state of UI controls available, that would make for some very plain-Jane components.


Solution

  • There are two ways to handle this. OK. Maybe more, but I will show two.

    1) Rely on ES6 imports and then your components just use `import something from './somefile.js". Yes, you will have to provide both the component and the library or reference a library that supports ES6 imports. But this prevents doubling up code.

    2) Package your components with their dependencies. Some people use things like Webpack, but I felt that was going too far so I created component-build-tools to allow you to write your components using import but then combining the components parts into a single file. This allows the components to be loaded in any browser even if they don't support import. The limitation here is that you need to load your combined component files in the correct order. For most projects this isn't difficult, but it is something you need to manage.