Condivisione di componenti polimerici parte 2

Nella prima parte di questa serie, ho esaminato come configurare la grande nuova piastra, untitled-elemento, che il team di Polymer ha creato per rendere la creazione e la condivisione di componenti di Polymer sostanzialmente più semplice.

Nel seguente tutorial, approfondirò cosa untitled-elemento include, come la sua documentazione di auto-generazione e come impostare il componente da distribuire tramite Bower. Continueremo a utilizzare il codice del componente Reddit che ho creato anche nel mio primo tutorial Polymer.

Uno sguardo dentro untitled-elemento

All'interno del progetto boilerplate, ci sono un paio di file chiave che userete:

  • bower.json - Ti permette di specificare le impostazioni e le dipendenze per il tuo componente
  • untitled-elemento master.html - il modello per il nuovo componente
  • untitled-elemento master.css - il modello di foglio di stile per lo stile del nuovo componente
  • index.html - il file HTML che include il core Polymer per la generazione di documentazione
  • demo.html - il file HTML che permetterà agli utenti di testare il tuo componente

Questi sono i file di base che vengono forniti quando si scarica per la prima volta il boilerplate dal repository GitHub PolymerLabs e servono da base per il nuovo componente. Nella prima parte, abbiamo ribattezzato untitled-elemento master.html a reddit-element.html e untitled-elemento master.css a reddit-element.css, dal momento che devono essere nominati come i nostri componenti. Abbiamo anche aggiornato i riferimenti a untitled-elemento in tutti i file, per garantire che il codice faccia riferimento al nome del componente corretto.

Diamo un'occhiata al codice all'interno di reddit-element.html: