We were looking to create a widget library and were wondering if it would be possible to create completely framework agnostic components (i.e. using only ES2015 syntax + html5 + css)<p>These widgets would be used in React, Angular, Vue applications.<p>Is creating web components the only answer? Integrating web components into a React/Angular application is not trivial either.
This is a suddenly, extremely busy area, in the form of web components. Using web components is quite easy from Angular already, and from several other frameworks including Vue. Web components is the standard in this area, I can't imagine an alternative would possibly get traction now that web components are here. I don't know what integration difficulty you're thinking of, but regardless, the answer will be to get the JavaScript from your web components on the page, in addition to the JavaScript from your main library/framework.<p>React has some irritations consuming web components in the current version (because it favors attributes over properties, which seemed like a good idea at the time), but in the next version that will be resolved also.<p>Some starting points:<p>Polymer - the upcoming version of that will be quite convenient to use with es2015 classes. Polymer is pretty much ready for production work today (including the new enormous YouTube revamp, which they are rolling out) but aimed at an older syntax.<p><a href="https://www.polymer-project.org/" rel="nofollow">https://www.polymer-project.org/</a><p>Skate might be closer to what you're looking for today, although it also has a significant revamp in progress that changes lots of things.<p><a href="https://github.com/skatejs/skatejs" rel="nofollow">https://github.com/skatejs/skatejs</a><p>The latest entrant is Stencil. It's not quite exactly the stack you described, rather it uses TypeScript. Stencil is extremely promising.<p><a href="https://stenciljs.com/" rel="nofollow">https://stenciljs.com/</a>