Published on January 4, 2017 by Chrome

It’s time to wrap up our series on Firebase and Polymer. In today’s episode we’ll look at how you can use the polymer-build library to craft a Gulpfile to bundle your Polymer and Firebase resources for production. polymer-build is a really helpful little resource that will take your HTML Imports and split them into individual streams for your CSS, HTML, and JavaScript. You can then pipe these streams to individual gulp tasks to do minification, etc. then use polymer-build to recombine the streams and output the final product.

Sample Code: github.com/Polymer/polycasts/tree/master/ep60-firebase-build

polymer-build: github.com/Polymer/polymer-build

Polycasts playlist: goo.gl/r5fsMq
Polymer Slack: bit.ly/polymerslack
Polymer G+: plus.google.com/communities/115626364525706131031

Subscribe to the Chrome Developers channel: goo.gl/OUF4e2

Leave a Reply

30 Comments on "Building Firebase for production — Polycasts #60"

Notify of
avatar

Cristian Iacobanu
Guest
Cristian Iacobanu
1 month 6 days ago

@Rob_Dodson – I really appreciate all the videos included, but I really do not appreciate the fact you haven't build the infrastructure to manage all these GitHub files that you have and actually include them on the Polymer website as documentation. People have time, but not to watch everything, search videos and videos to quickly find a way to a quick fix you might need in your project.For example, I'd freaking appreciate clear documentation on how to change data-binding braces. I know I've seen some info in a video, but ask me if I know which….

Krishna Chaitanya Kornepati
Guest
Krishna Chaitanya Kornepati
1 month 25 days ago

I just wanted to ask a question. Now that Neon animated pages is deprecated, is there any element replacing it or do we have to implement our own animations using animation api. (as mentioned in the docs)

natebarnz
Guest
natebarnz
2 months 16 hours ago

I am getting this error when running "npm run build". Anyone know why?[22:49:51] Starting 'default'…Deleting build/ directory…Analyzing build dependencies…error: In public/bower_components/polymer/lib/legacy/polymer-fn.html: [could-not-load] – Unable to load import: Cannot read property 'forEach' of undefined(node:44730) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: 1 error(s) occurred during build.[22:49:54] The following tasks did not complete: default[22:49:54] Did you forget to signal async completion?

Michael Fons
Guest
Michael Fons
3 months 9 days ago

this does not seem to readily work against polymer 2; wondering if anybody else is working on getting this working?

Filip Göranson
Guest
Filip Göranson
4 months 16 days ago

I used the code in the description but the process fails. Whats wrong?Starting 'default'…Deleting build/ directory…Analyzing build dependencies…The following tasks did not complete: defaultDid you forget to signal async completion?

Michael Fons
Guest
Michael Fons
3 months 9 days ago
I got something like that too…my error a bit higher in the log said it could not find webcomponent-min.js or something. There is a version of this without the "-min" in approximately where it was looking but since I was trying to do this video exercise against polymer2 I was assuming that file may have been replaced with something. This is why I am was asking around.If I can get this working then there that gives me an entree into polymer 2 for my app, since the process of doing the migration is overwhelming my mind at the moment, as… Read more »
Srikanth Gatta
Guest
Srikanth Gatta
4 months 25 days ago

#AskPolymer I watched Arrays/Objects data biding many times but somehow still not getting it right. But now with Firebase it seems its more unclear why its working sometimes and not othertimes.For ex: when I create a <firebase-document … data={{myData}}> and insome <paper-input value={{myData.text}}/>, anytime I change the text in input filed it AUTOMATICALLY stores directly inside firebase database. But When try the same in javascript function for someother property, say myData.title = newTitle, this is not saved in Firebase database. Can someone point me to good examples of array,object bindings that work with Firebase+Polymer.

John-Paul Ensign
Guest
John-Paul Ensign
5 months 1 day ago

#AskPolymer Can the order of the videos in the Playlist be corrected? They are currently backwards so autoplay goes the wrong way. To go "forward" in Polycasts, you need to press Previous two times (once only will restart the current video).

Michael Fons
Guest
Michael Fons
3 months 9 days ago

Actually I kind of like that it plays backward 🙂 Then it is kind of like watching the movie Momento lol. Actually though, I truly feel that the best learning happens when you are drinking from a firehose, and then learning the details as you trip up and go investigating.

Alex Goodwin
Guest
Alex Goodwin
5 months 24 days ago

Awesome!

JoséAntonio Campillo
Guest
JoséAntonio Campillo
5 months 29 days ago

Why can't i vulcanize for polyfire app?? thanks so much

pullModel
Guest
pullModel
6 months 1 day ago

If I am keeping my facts straight, then Firebase now supports HTTP 2 which I believe that I have read is better with unbundled builds than bundled? But this polycast is about how to bundle? Am I getting one of my facts wrong?

1 2 3
wpDiscuz