meteor
Polymeer gebruiken met meteoor

Differentiaal gebruiken: vulkaniseren

Zorg ervoor dat Bower in de root van uw project is geïnstalleerd ( npm install -g bower ) en voer bower init . Hiermee maakt u een bower.json bestand in de map van uw project.

Maak een nieuw bestand met de naam .bowerrc in uw hoofdmap. Het moet het volgende bevatten:

{
  "directory": "public/bower_components"
}

Dit laat Bower weten dat het componenten moet opslaan in de map bower_components in de bower_components map van uw app.

Voeg nu de polymeercomponenten toe die u met uw app wilt gebruiken.

In de hoofddirectory van uw app kunt u elk onderdeel dat u wilt gebruiken, installeren.

bower install --save PolymerElements/paper-button#^1.0.0 PolymerElements/paper-checkbox#^1.0.0

Vulcaniseren toevoegen aan uw project

Meteor add differential:vulcanize

Maak een nieuw bestand met de naam config.vulcanize in de hoofdmap van uw project. Het moet het volgende bevatten:

{
    "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" moet elk onderdeel vermelden dat u in uw app zult gebruiken.

U kunt nu componenten gebruiken die u in uw Blaze-sjablonen hebt geïmporteerd, net zoals elk ander element:

<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>