javascript - Polymer 1.0 in Ember-cli, wrong appearance -


i have managed integrate polymer 1.0 ember-cli project. brocfile

var vulcanize = require('broccoli-vulcanize'); var pickfiles = require('broccoli-static-compiler'); var mergetrees = require('broccoli-merge-trees'); var emberapp = require('ember-cli/lib/broccoli/ember-app');   var app = new emberapp({   compassoptions: {     sassdir: "app/styles/main",     outputstyle: 'expanded'   } });  //app.import("./bower_components/webcomponentsjs/webcomponents-lite.min.js");  var polymervulcanize = vulcanize('app', {     input: 'elements.html',     output: 'assets/vulcanized.html', /*    inline: true,     strip: false,*/     excludes: [/*/^data:/, /^http[s]?:/, /^\//*/],    /* stripexcludes: false,     stripcomments: false,     inlinescripts: false,*/     inlinecss: true   })   ; var polymer = pickfiles('bower_components/', {   srcdir: '',   files: [     'webcomponentsjs/webcomponents-lite.min.js',     'polymer/polymer.html' //  'polymer/polymer.js'   ],   destdir: '/assets' });  //bootstrap  app.import('./bower_components/bootstrap/dist/js/bootstrap.js'); app.import('./bower_components/bootstrap/dist/css/bootstrap.css'); 

this how include everything:

<!doctype html> <html> <head>   <meta charset="utf-8">   <meta http-equiv="x-ua-compatible" content="ie=edge">   <title>front</title>   <meta name="description" content="">   <meta name="viewport" content="width=device-width, initial-scale=1">   <script src="assets/webcomponentsjs/webcomponents-lite.min.js"></script>   {{content-for 'head'}}   <link rel="stylesheet" href="assets/vendor.css">   <link rel="stylesheet" href="assets/front.css">   <script src="assets/vendor.js"></script>   <script src="assets/front.js"></script>   <link rel="import" href="assets/vulcanized.html">   {{content-for 'head-footer'}} </head> <body> {{content-for 'body'}} {{content-for 'body-footer'}} </body> </html> 

and buttons in index.hbs

<paper-spinner active></paper-spinner> <paper-button>flat button</paper-button> <paper-button raised>raised button</paper-button> 

what have in result wrong rendered buttons 1 of 4/5 times.

this how looks: enter image description here

and normal: enter image description here

if im right problem in paper-material, have no idea do. enter image description here

any ideas?

i have been trying use polymer 1.0 ember last month, turns out polymer elements use insertion points not work ember.

i have spoken polymer core member , said curerntly working in interop things working should take time.

i have opened issue on emberjs repo(https://github.com/emberjs/ember.js/issues/11361), can follow there well.

try move code index.hbs in index.html instead, solve problem these elements not work under route.


Comments

Popular posts from this blog

How to connect android app to App engine -

gcc - MinGW's ld cannot perform PE operations on non PE output file -

php - display validation error message next to the textbox in codeigniter -