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>


Modified text is an extract of the original Stack Overflow Documentation
Lizenziert unter CC BY-SA 3.0
Nicht angeschlossen an Stack Overflow