zakizaki-ri9 / clasp-sample

google/claspのおためしコード

はじめに

google/claspを用いたgasのサンプル。
以下にインストール〜gasとしてGoogleDriveへpushするまでの手順を記載します。

参考記事

以下の記事を参考にさせていただきました。
ありがとうございました。

• claspでGoogle Apps Scriptの開発環境を整える
• 5分で作るclaspを使ったGoogle Apps Scriptの開発環境

では本題へ。

手順

インストール・ログイン

# インストール
yarn add global @google/clasp
# npm i @google/clasp -g

# ログイン
clasp login
# この後、Googleアカウントのパスワードを入力

ログイン後、ブラウザの新規タブが開き、
claspからの操作の許可を求められるので許可します。

Google Apps Script APIの有効化

以下からGoogle App Script APIの有効化を行います。
https://script.google.com/home/usersettings

アプリの作成・デプロイ

# 作成
clasp create app-name

GAS用のフォルダを作成済みの場合はclasp create .でもおkです。

今回テスト用に以下のソースコードを作成します。

src/sample.js

// @ts-nocheck
function echoMessage(msg) {
  Logger.log(msg);
}

function main() {
  ["hello", "world", "!"].forEach(function (msg) {
    echoMessage(msg);
  });
}

ここまで実装すればデプロイできるのですが、
このままだとnode_modulesなど、
不要なファイルも一緒にデプロイされてしまいます。
（時間がかかる...）

そのため、.claspignoreの作成・設定を行います。

.claspignore

**/**
!src/*.js
!appsscript.json

上記ファイルの作成が終わったらデプロイ実施、
そのままデプロイされているか確認します。

# デプロイ(push)
clasp push

# デプロイが終わったら、ブラウザからGASとして出力されているか確認
clasp open

src/sample.gsというファイル名が作成されていたら、
デプロイおkです。

GitHubへのpush

不要なファイルをコミットしないよう、
.gitignoreを作成・設定します。

.gitignore

node_modules/
.vscode/
.clasp.json

VSCode使わない方は.vscode/は不要になります。
これであとはコミットと自分のリポジトリへpushするだけでおkです。
お疲れ様でした。

# 念のため初期化〜コミット
git init
git add -A
git commit -m "{なにかコメントを}"

# push
git push

ファイルの説明

.clasp.json

{"scriptId":"〜"}

clasp createした際に作成されます。
キーが格納されているため、誤ってGitHubに公開しないよう、
.gitignoreに追記しておくこと。

最後に

以下の記事を参考に、TypeScriptで書くのも良さそう。
てか、TSの方が良いだろうな...

• claspとTypeScriptの型定義で楽をする2018年のGoogle Apps Script開発