Recherche…
En utilisant le différentiel: vulcaniser
À la racine de votre projet, assurez-vous que Bower est installé ( npm install -g bower
) et exécutez bower init
. Cela créera un fichier bower.json
dans le répertoire de votre projet.
Créez un nouveau fichier appelé .bowerrc
dans votre répertoire racine. Il devrait contenir les éléments suivants:
{
"directory": "public/bower_components"
}
Cela permet à Bower de savoir qu'il doit enregistrer les composants dans le dossier bower_components
répertoire public de votre application.
Ajoutez maintenant les composants Polymer que vous souhaitez utiliser avec votre application.
Dans le répertoire racine de votre application, bower-install chaque composant que vous souhaitez utiliser.
bower install --save PolymerElements/paper-button#^1.0.0 PolymerElements/paper-checkbox#^1.0.0
Ajouter Vulcanize à votre projet
Meteor add differential:vulcanize
Créez un nouveau fichier appelé config.vulcanize à la racine de votre projet. Il doit contenir les éléments suivants:
{
"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"
devrait lister chaque composant que vous utiliserez dans votre application.
Vous pouvez maintenant utiliser les composants que vous avez importés dans vos modèles Blaze, comme vous le feriez avec tout autre élément:
<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>