1

I'm fairly new to both ember-cli and polymer so bear with me.

My problem here is that I am trying to use Polymer webcomponents within my ember-cli project, however I have not been able to find an add-on or solution that works with the current versions of ember, ember-cli, and polymer that I have (all of which are the latest versions).

I have tried the ember-polymer, ember-cli-polymer, and ember-cli-polymer-toolchain addons on npm for emebr-cli and none have worked. Below is the code that I have included in my brocfile.js and I have already checked that I have installed the correct dependencies needed to vulcanize and merge the files i need.

Is there an official addon supported by the ember team, or is there simply no supported way to accomplish this. It would be a shame to not be able to include polymer's webcomponents in my projects.

Thanks in advance for your help.

var EmberApp = require('ember-cli/lib/broccoli/ember-app');
var pickFiles   = require('broccoli-static-compiler');
var mergeTrees  = require('broccoli-merge-trees');
var vulcanize = require('broccoli-vulcanize');

var app = new EmberApp();

var polymer = pickFiles('bower_components/', {
  srcDir: '',
  files: [
    'polymer/polymer.html',
    'polymer/polymer.js',
    'webcomponentsjs/webcomponents.js'
  ],
  destDir: '/assets'
});

var polymerVulcanize = vulcanize('app', {
  input: 'elements.html',
  output: 'assets/vulcanized.html',
  csp: true,
  inline: true,
  strip: false,
  excludes: {
    imports: ["(^data:)|(^http[s]?:)|(^\/)"],
    scripts: ["(^data:)|(^http[s]?:)|(^\/)"],
    styles: ["(^data:)|(^http[s]?:)|(^\/)"]
  }
});

module.exports = mergeTrees([
  polymerVulcanize,
  polymer,
  app.toTree([polymerVulcanize])
]);
mmaines
  • 43
  • 1
  • 3
  • I am using "ember": "1.13.12", "polymer": "^1.2.4", and "webcomponentsjs": "0.7.20" – mmaines Feb 01 '16 at 15:32
  • Have you added polymer assets to the index.html - like `{{content-for 'head'}}`? – Adam Knights Feb 01 '16 at 16:04
  • Instead of trying to use polymer with Ember, I'd suggest poking needles into your eyes. I think it would be a lot more fun. –  Feb 01 '16 at 16:07
  • @Knightsy I have indeed added all of the dependencies but nothing seems too work. At this point I feel like both Polymer and Ember do exactly the same thing in different ways (the only major difference being Ember Data). So at this point I think I need to really just decide which one better suits my needs at the moment. – mmaines Feb 05 '16 at 22:05

2 Answers2

0

This website gives a good guide for doing it without an addon:

http://www.programwitherik.com/how-to-add-polymer-to-your-ember-project/

Searching http://www.emberaddons.com/?query=polymer shows four results, ember-cli-polymer-toolchain looks most promising with ember-polymer and ember-cli-polymer also possible - although neither have been updated in the last year. Although you've tried these so I'm guessing not.

Adam Knights
  • 2,141
  • 1
  • 25
  • 48
0

Try using ember-polymer. I created this addon recently and am maintaining it frequently.

dunnkers
  • 21
  • 3