TypeScript + clasp で Google Apps Script の開発環境を整える


静的型付け言語に慣れすぎてしまっているため、Google Apps Script(以下、gas)をJavaScriptで書くのがとても辛い。
Google謹製のgasプロジェクト管理ツール clasp を使えばTypescriptでも書くことができる、とのことだったので試してみる。

参考)
- Command Line Interface using clasp
- clasp/README.md at master · google/clasp
- clasp/typescript.md at master · google/clasp

インストール

以下のコマンドでclaspをinstallします:

npm install -g @google/clasp

ユーザ設定からGoogle Apps Script API を有効にします。: https://script.google.com/home/usersettings

この設定が漏れていると以降のclaspの認証がうまくいきません。

ログイン

claspからgasにログインします。

clasp login

上記のコマンドを実行するとGoogleアカウントへの認証が求められるので、案内に従いログインします。
以後、全てのclaspの操作はここでログインしたアカウントのgasに対して行われます。

アカウントを切り替えたい場合は一度ログアウトと行う必要があります。

clasp logout

現在の接続先のアカウントの状態を確認したい場合は以下のコマンドから行えます。

clasp login --status

プロジェクト作成

プロジェクトをフォルダに移動します。

cd /path/to/project/dir

TypeScriptの型定義モジュールをinstallします。

npm i -S @types/google-apps-script

mode_modulesディレクトリとpackage-lock.jsonが作成さることを確認します。

$ gas-sample tree -L 1
.
├── node_modules
└── package-lock.json

1 directory, 1 file

gasプロジェクトを作成します。

clasp create --type standalone

作成されたプロジェクトの構成を確認します。

$ gas-sample tree -a -L 1
.
├── .clasp.json
├── appsscript.json
├── node_modules
└── package-lock.json

1 directory, 3 files

claspでログインしている先のgasにアクセスし、プロジェクトが作成されていることを確認します。

ファイルの作成およびアップロード

プロジェクトにアップロードするファイルを作成します。

touch hello.ts

ファイルの中身を記載します。今回はベタなやつで。

hello.ts
function hello() {
  console.log("Hello World.");
}

clasp pushでアップロードされます。

$ clasp push
└─ /workspaces/gas-sample/hello.ts
Pushed 1 files.

無事アップロードされました。

問題なく実行もできます。

次回からは実際にGoogle Calender APIを絡めた実装に着手します。