Using Babel with Cloud Functions for Firebase

1,255 views
Skip to first unread message

Jon Pokrzyk

unread,
May 4, 2017, 2:47:24 PM5/4/17
to Firebase Google Group
Can someone with some extra time on their hands create sample repo using cloud functions for firebase and babel? I'll prob take a stab at in the next couple of days but I have a feeling I'm not the best person to blaze the way. Doesn't seem like anyone's posted any code about using babel with Google Cloud functions or Cloud Functions for Firebase anywhere.

Or that would be an awesome addition to https://github.com/firebase/functions-samples.

Now that I'm using async/await the thought of going back to promises makes me sad ;)

Alan deLespinasse

unread,
May 24, 2017, 11:38:44 AM5/24/17
to Firebase Google Group
I put up a minimal demo here, using JSPM to manage the Babel transpilation and bundling: https://github.com/adelespinasse/fcfjspmsimple

The key was to have functions/index.js be a vanilla JavaScript Node.js module that imports firebase-functions and firebase-admin with require(). It can then also import the transpiled ES2016 bundle created by JSPM. I assume you could do a similar thing with whatever tools you use, if you're not a JSPM user. (When I tried bundling the Firebase libraries into the bundle using JSPM, it couldn't be deployed; the deployment process seems to be deeply weird.)

Nick Okunew

unread,
May 25, 2017, 10:03:02 AM5/25/17
to Firebase Google Group
I might be missing something, but we run babel (with a .babelrc). Just works.

package.json
"main": "build/index.js",
"scripts": {
"build": "babel src/ -d build",
"prebuild": "yarn test",
"test": "eslint src && flow"
}

src/index.js
// @flow

import functions from 'firebase-functions';
import admin from 'firebase-admin';
import { amazingFunction } from './amazingFunction';

admin.initializeApp(functions.config().firebase);

export default {
amazingFunction,
}

Alan deLespinasse

unread,
May 25, 2017, 1:46:05 PM5/25/17
to Firebase Google Group
What does the generated code look like when you do this? It's possible that the output is much cleaner when using Babel directly, as opposed to JSPM, which does some messy things when generating a bundle.

Michael Bleigh

unread,
May 25, 2017, 2:00:02 PM5/25/17
to Firebase Google Group
My understanding is that JSPM is largely meant for browser-side things, so I'd recommend going with Babel directly when building Node.js functions.

--
You received this message because you are subscribed to the Google Groups "Firebase Google Group" group.
To unsubscribe from this group and stop receiving emails from it, send an email to firebase-tal...@googlegroups.com.
To post to this group, send email to fireba...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/firebase-talk/ebcb7992-12f3-4475-8439-2b1a17533b0c%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Alan deLespinasse

unread,
May 25, 2017, 2:21:52 PM5/25/17
to Firebase Google Group
JSPM works with both browsers and Node (at least, the beta version does; the "stable" version tried to but was much less usable with Node). If you're using it for browser code, and you're sharing any code at all between browser and server, then it makes a lot of sense to use it for the server side as well.

I'm not highly recommending JSPM, since it's been a pain for us in many ways, but I'm not sure there are any alternatives that aren't ever a pain. If there are, I'd love to hear about it!
Reply all
Reply to author
Forward
0 new messages