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>


Modified text is an extract of the original Stack Overflow Documentation
Sous licence CC BY-SA 3.0
Non affilié à Stack Overflow