LoginSignup
1
0

More than 3 years have passed since last update.

Cloud Functionの開発(gulp使用)

Last updated at Posted at 2019-08-30

最近JavaScript(ES6)にもハマっております。
nodeのデプロイ先としてCloud Functionを利用していますが、機能も多く、1人だと割とつまづきながらの開発だったので、メモがてらたくさんのタグと共に私の知見をまとめました。
ソースはGitHubにfirebase-gulp-sampleをアップしてあります。
中身などはREADMEを確認していただくとして、今回ハマったりポイントとした点を挙げたいと思います。

uglifyでES6が圧縮できない

いつも通り「.pipe(uglify())」と書いただけでは以下のようなエラーが発生します。

Caused by: SyntaxError: Unexpected token: keyword «const»

調べてみると、ES6には対応していないようです。
なので、こちらの記事を参考にbabel7を使って対応しました。
(ありがとうございました!)

Circle CIでfirebaseコマンドが見当たらない

そりゃそうです。。。
なのでfirebase-toolsをインストール後、node_modules/.bin/以下から呼び出してデプロイしました。
(.circleci/config.ymlを見ていただければ…)

開発中はfirebase serveとgulp watchを同時に使いたい

別にターミナルを2つ立ち上げて対応してもいいのですが、せっかくツールを導入しているので、1コマンドで対応したいところです。
expressであればgulp-live-serverなどがあるようですが、似たようなライブラリは私が探した限りなさそうでした。
なので、原始的にchild_processで立ち上げるようにしました。

  exec('firebase serve', { cwd: '.' }, (error, stdout, stderr) => {
    if (error) console.log("error: " + error)
    if (stdout) console.log("stdout: " + stdout)
    if (stderr) console.log("stderr: " + stderr)
  })

ただ、これだとfirebase serveのログが出力されないので、何かしらtailができるものがあると、よりよいかもしれません。
(ログファイルをwatchかけるとか…)

functionsのURLをhostingと同じにしたい

あるあるですよね?(ないですか?)
プロジェクト直下のfirebase.jsonにrewriteを追記することで対応できました。

"rewrites": [{
  "source": "**",
  "function": "app"
}]

Cloud Functionでセッションを使いたい

Expressと連携すればexpress-sessionが使えると思ったのですが、どうも上手くセッションが保持できません。
(インメモリを使わせないようにするとかあるのかな?)
なのでFirebaseStoreを使い、RealtimeDatabase側で管理するようにしました。

最後に

どなたかの参考になれば幸いです。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0