Suche…
Mit Differential: vulkanisieren
Stellen Sie im Stammverzeichnis Ihres Projekts sicher, dass Bower installiert ist ( npm install -g bower
), und führen Sie Bower bower init
. Dadurch wird eine bower.json
Datei im Verzeichnis Ihres Projekts erstellt.
Erstellen Sie eine neue Datei mit dem Namen .bowerrc
in Ihrem Stammverzeichnis. Es sollte Folgendes enthalten:
{
"directory": "public/bower_components"
}
Dadurch kann Bower wissen, dass Komponenten im Ordner " bower_components
" im öffentlichen Verzeichnis Ihrer App bower_components
.
Fügen Sie nun die Polymerkomponenten hinzu, die Sie mit Ihrer App verwenden möchten.
Installieren Sie im Stammverzeichnis Ihrer App jede Komponente, die Sie verwenden möchten.
bower install --save PolymerElements/paper-button#^1.0.0 PolymerElements/paper-checkbox#^1.0.0
Fügen Sie Ihrem Projekt Vulcanize hinzu
Meteor add differential:vulcanize
Erstellen Sie eine neue Datei mit dem Namen config.vulcanize im Stammverzeichnis Ihres Projekts. Es sollte Folgendes enthalten:
{
"polyfill": "/bower_components/webcomponentsjs/webcomponents.min.js",
"useShadowDom": true, // optional, defaults to shady dom (polymer default)
"imports": [
"/bower_components/paper-button/paper-button.html",
"/bower_components/paper-checkbox/paper-checkbox.html"
]
}
"imports"
sollte jede Komponente auflisten, die Sie in Ihrer App verwenden werden.
Komponenten, die Sie in Ihre Blaze-Vorlagen importiert haben, können Sie jetzt wie jedes andere Element verwenden:
<template name="example">
<div>
this is a material design button: <paper-button></paper-button>
this is a material design checkbox: <paper-checkbox></paper-checkbox>
</div>
</template>