LoginSignup
0
0

More than 1 year has passed since last update.

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

Last updated at Posted at 2022-01-28

静的型付け言語に慣れすぎてしまっているため、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

Enable Apps Script API

この設定が漏れていると以降の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にアクセスし、プロジェクトが作成されていることを確認します。

スクリーンショット 2022-01-28 15.36.44.png

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

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

touch hello.ts

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

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

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

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

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

スクリーンショット 2022-01-28 17.02.06.png

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

スクリーンショット 2022-01-28 17.04.14.png

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

0
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
0
0