In Teil eins dieser Serie habe ich die Konfiguration der großartigen neuen Boilerplate durchgearbeitet, Element ohne Titel
, dass das Polymer-Team geschaffen hat, um die Erstellung und gemeinsame Nutzung von Polymerkomponenten wesentlich zu vereinfachen.
Im folgenden Tutorial werde ich tiefer in das eingehen Element ohne Titel
Enthält, wie die automatische Dokumentationsfunktion, und wie Sie Ihre Komponente für die Verteilung über Bower einrichten. Wir werden weiterhin den Reddit-Komponentencode verwenden, den ich in meinem ersten Polymer-Lernprogramm erstellt habe.
Element ohne Titel
Innerhalb des Boilerplate-Projekts gibt es einige Schlüsseldateien, die Sie verwenden werden:
bower.json
- Hier können Sie Einstellungen und Abhängigkeiten für Ihre Komponente angebenuntitled-element-master.html
- die Vorlage für die neue Komponenteuntitled-element-master.css
- die Stylesheet-Vorlage, um Ihre neue Komponente zu formatierenindex.html
- die HTML-Datei, die den Polymerkern für die Dokumentationserstellung enthältdemo.html
- die HTML-Datei, mit der Benutzer Ihre Komponente testen könnenDies sind die Basisdateien, die bereitgestellt werden, wenn Sie die Boilerplate zum ersten Mal aus dem GitHub-Repo von PolymerLabs herunterladen und als Grundlage für Ihre neue Komponente dienen. Im ersten Teil haben wir umbenannt untitled-element-master.html
zu reddit-element.html
und untitled-element-master.css
zu reddit-element.css
, da sie gleich benannt werden müssen wie unsere Komponente. Wir haben auch Verweise auf aktualisiert Element ohne Titel
in allen Dateien, um sicherzustellen, dass der Code auf den richtigen Komponentennamen verweist.
Schauen wir uns den Code in an reddit-element.html
: