← Ruta· Lección 7 de 8

Export dual: ES module + Custom Element

Exportar la clase y registrar la etiqueta — dos formas de consumir la misma lib.

TODO i18n: Traducción completa pendiente. Título y descripción localizados; el cuerpo permanece en portugués por ahora.

Uma boa lib de Web Components oferece dois caminhos:

Side-effect / auto-register — import 'image-gallery' define a tag
Named export — import { ImageGallery, register } from 'image-gallery'

Padrão

export class ImageGallery extends HTMLElement { /* ... */ }

export function register(tag = 'image-gallery') {
  if (!customElements.get(tag)) {
    customElements.define(tag, ImageGallery);
  }
}

register(); // auto-register no entry padrão

`package.json` exports

{
  "name": "@css4html/image-gallery",
  "type": "module",
  "exports": {
    ".": {
      "import": "./dist/image-gallery.es.js"
    }
  }
}