source https://divshot.com/blog/web-components/building-a-qa-system-with-polymer-and-firebase/
updated to polymer 1.0.0
npm install -g yo
npm install -g generator-polymer yo polymer gulp serve ( a la place de grunt serve)
ne pas supprimer elements.html , mais lui rajouter une ligne :
<link rel="import" href="qa-app/qa-app.html">
creation d'une <qa-app> dans app/elements avec ce code :
<link rel="import" href="../../bower_components/polymer/polymer.html">
<link rel="import" href="../../bower_components/paper-styles/typography.html">
<dom-module id="qa-app">
<template>
<style include="shared-styles">
:host {
display: block;
}
<!-- span,
input {
@apply(--paper-font-body2);
}-->
</style>
<!-- <h1 class="page-title" tabindex="-1">{{greeting}}</h1>
<label for="greeting-input">Update text to change the greeting.</label>
<!-- Listens for "input" event and sets greeting to <input>.value -->
<!-- <input id="greeting-input" value="{{greeting::input}}"> -->
</template>
<script>
(function() {
'use strict';
Polymer({
is: 'qa-app',
/* properties: {
greeting: {
type: String,
value: 'Welcome!',
notify: true
}
}*/
});
})();
</script>
</dom-module>
insertion dans index.html :
<paper-material elevation="1">
<qa-app></qa-app>
</paper-material>
Au lieu de core-components (<0.8) utiliser bower install --save
en ayant pris soin de corriger le fichier bower.json ainsi :
{
"name": "polymer1-qa",
"authors": [
"D.FAVERIS"
],
"private": true,
"dependencies": {
"iron-elements": "PolymerElements/iron-elements#^1.0.0",
"neon-elements": "PolymerElements/neon-elements#^1.0.0",
"page": "visionmedia/page.js#^1.6.4",
"paper-elements": "PolymerElements/paper-elements#^1.0.1",
"platinum-elements": "PolymerElements/platinum-elements#^1.1.0",
"polymer": "Polymer/polymer#^1.6.0"
}
}
ajustez les imports ainsi :
<link rel="import" href="../../bower_components/polymer/polymer.html">
<link rel="import" href="../../bower_components/paper-styles/typography.html">
<link rel="import" href="../../bower_components/paper-header-panel/paper-header-panel.html">
<link rel="import" href="../../bower_components/paper-toolbar/paper-toolbar.html">
<link rel="import" href="../../bower_components/iron-icons/social-icons.html">
<link rel="import" href="../../bower_components/paper-menu/paper-menu.html">
<link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html">
<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="../../bower_components/paper-menu-button/paper-menu-button.html">
<link rel="import" href="../../bower_components/paper-item/paper-item.html">
<dom-module id="qa-app">
<template>
...
bower install --save firebase/polymerfire a la place de
bower install Polymer/firebase-element --save
Voir avec PolyUp pour upgrader un module Polymer 0.5 en Polymer 1.0
