Bento: Consider shipping custom elements via npm

Description

While a Bento React/Preact component can be consumed via npm, the custom element version can be loaded from the CDN. For npm, one will be locked to a specific version as per the package.json/package-lock.json file, whereas the CDN version is evergreen.

When not updating the npm packages frequently, the two versions will get out of sync quickly.

Example: I am building a WordPress plugin with a custom Gutenberg block with a carousel, using @ampproject/amp-base-carousel. If my users don’t update the plugin in a very long time, the React component I ship with the plugin will become super old, but the web component on the frontend is up-to-date. There could be visual disparity or other differences between the two, which could cause confusion and perhaps even bugs.

Another issue is that some users don’t want their components to be loaded from a CDN but instead want to load them from their own server.

For me as developer there’s currently no easy way to offer that, because the custom element is not shipped via npm. If it were, then I can just bundle it with my plugin together with the React component.

Alternatives Considered

Developers could manually download the JS&CSS from the CDN and put it in their code base and hope that it’s the same version as the one they got from npm.

Additional Context

No response

[estherkim]

Hi @swissspidy, web components via Option 1 are published on npm starting with v1.2110212130.0 - can you give it a try?

(Starting tomorrow, web-component.js will be the main script in package.json)

[samouri]

Why not both?

No reason. We’ll implement both then 👍