GoogleAppScript+clasp+TypeScriptで作るSlackBot

株式会社アクシスのアドベントカレンダー23日目の記事です🎄

GASを使って社内用のSlackボットを開発しようと思ったのですが
GASのブラウザエディタの使い勝手があまり良くなく、個人的には好みではありませんでした...

なので色々と試してみたところ clasp を使えばローカルのエディタで開発でき、さらにTypescriptでのコーディングもサポートしていたのでその手順をまとめてみました!

手順

claspインストール

まずはプロジェクト作成

$ npm init -y

claspインストール

$ npm install -D @google/clasp

最後にGAS用のTypescript定義をインストール

$ npm install -D @types/google-apps-script

clasp設定

Googleにログイン

$ npx clasp login

ブラウザでGoogleのログインフォームが表示されるのでログイン情報を入力
権限を許可するか聞かれるので「許可」をクリック

ターミナル上に認証成功のメッセージが表示されていればOK

Authorization successful.

Default credentials saved to: ~/.clasprc.json

成功したらclaspプロジェクトを作成
スクリプトの種類を聞かれるので standalone を選択

$ npx clasp create ${プロジェクト名}

? Create which script? (Use arrow keys)
❯ standalone
  docs
  sheets
  slides
  forms
  webapp
  api

push

claspはTypeScriptをサポートしているので、ts拡張子ファイルをpushした場合はJavascriptにトランスコンパイルしてpushしてくれる。

とりあえず動作確認のためにコードをpushしてみる

$ echo 'const helloWorld = () =>  Logger.log("Hello, App Script!");' >> app.ts
$ clasp push
$ clasp open

ブラウザが開くのでコンパイルされたGASコードが表示されたらOK

// Compiled using ts2gas 3.6.3 (TypeScript 3.9.7)
var helloWorld = function () { return Logger.log("Hello, App Script!"); };

bot作成

botの作成については時間がなかったので @_nsk_さんがアドベントカレンダーで書いてくれてたので割愛
https://qiita.com/_nsk_/items/b8b2f71cfbecb6e2ec59#2incoming-webhook-%E3%81%AE%E8%A8%AD%E5%AE%9A

感想

無料でコードを実行できる環境としてGoogleAppScriptを愛用していましたが
claspのおかげでさらに好きになりました。(時間があればBot作成の部分を詳しく書きたい...)

皆さんもボット開発を行いたいときはGoogleAppScript+claspで開発してみてはいかがでしょうか?