Use unpublished Polymer2 custom elements

Question

I'm new in working with Polymer 2. I created two custom elements, let's call them <a-elem> and <b-elem>. I want to use these two together in a new element called <c-elem>. So when developing <c-elem> I can't just bower install --save a-elem b-elem because these are not published online (yet). But before testing everything together I don't want to publish them. I could just copy their directories and paste them into the /bower_components folder of c-elem but since /bower_components is a generated folder, it isn't pushed to the private git repo, so whenever a colleague wants to work with c-elem, he would be missing these dependencies. Keep in mind, that I'm very new to web development and want to follow best practices, so this might be an easy answer for some of you. After researching for a couple of hours I couldn't find any "Polymer way of doing it". So maybe just create a folder /lib and copy them in there? But then all changes I make to a-elem and b-elem wouldn't change the copies in c-elem.

How can I include a-elem and b-elem into c-elem (preferably with setting dependencies) the right way?

EDIT: Also if the solution is to just copy the elements into a /lib folder, the html imports in the demo of c-elem would be completly wrong. So I would have to create a whole different version of a-elem and b-elem. This can't be the only way.

score 2 · Accepted Answer · answered Jan 16 '18 at 11:38

Found the answer in this post bower registering local git package.

It wasn't a Polymer thing but more of a bower thing really. So searching for the "Polymer way" naturally didn't use anything. For now I'll include the local git repositories like this in the bower.json file of c-elem:

{
  "name": "c-elem",
  "description": "Description to c-elem",
  "main": "c-elem.html",
  "dependencies": {
    "polymer": "Polymer/polymer#^2.0.0",
    "b-elem": "C:/local/path/to/b-elem/.git",
    "a-elem": "C:/local/path/to/c-elem/.git""
  },
  "devDependencies": {
    "iron-demo-helpers": "PolymerElements/iron-demo-helpers#^2.0.0",
    "web-component-tester": "Polymer/web-component-tester#^6.0.0",
    "webcomponentsjs": "webcomponents/webcomponentsjs#^1.0.0"
  },
  "resolutions": {
    "polymer": "^2.0.0"
  }
}

By doing this bower install will save the custom elements in the /bower_components folder and bower update will refresh the dependencies whenever a commit to the git repositories is made.

I will have to change this to use a private git repo when it is set up, but probably it should be possible by simply changing the local path to an url or something like that. If you know how to do this exactly, I'd welcome a comment :)

Use unpublished Polymer2 custom elements

1 Answers1