LoginSignup
0
4

More than 3 years have passed since last update.

ClaspでGoogle Apps Scriptのローカル開発環境を構築する

Last updated at Posted at 2019-09-05

Google Apps Script(以下GAS)、便利ですよね。
仕事でG Suite使ってるのであれば、ちょっとした作業の自動化だったり、ツールの開発をサクッとできて便利です。
コードをブラウザで書いてすぐに実行できるのもありがたいです。
その反面、ソースコードの管理が疎かになったりするので、ローカルで開発したいというニーズもあったりするみたいです。

そこで、Googleが提供しているCLIツール、Claspを使って、Web上のソースとローカルのソースの同期を取って、
自分の好きなエディタで書いたり、Gitでソース管理したりできるようにしようと思います。

環境

OS: Windows10 Pro Education
エディタ: VSCode(Version 1.38)

Claspを導入する

Node.jsをインストールし、以下のコマンドを実行する。
https://nodejs.org/ja/

# npmコマンドが実行できるか確認
npm --version

# Claspインストール
npm install -g @google/clasp

# Googleアカウントでログイン
# ブラウザが起動するので画面に従ってログイン、アクセスを許可する。
# クレデンシャルファイルとして、~/.clasprc.jsonが作成される。
clasp login

ローカル開発環境の構築

ついでに、普段Java Scriptを書くことがないので、それっぽい環境を構築します。
VScodeを使う前提で、必要なモジュール、拡張機能を入れていきます。

# Eslint、Prettierをインストール
npm install -g eslint
npm install -g prettier

その後、VScodeの拡張機能、「Eslint」、「Prettier」をインストールします。
これで構文チェックやフォーマットしてくれます。

Claspを使ってみる

まずは適当なGASプロジェクトを作ります。適当なコードを書きます。
コード.gsを、main.gsにリネームしました。
ファイル > プロジェクトのプロパティ
でスクリプトIDを確認してください。このIDを使います。

# GASプロジェクトを取得
clasp clone [YOUR_SCRIPT_ID]

# 実行結果
# Cloned 2 files.
# └─ main.js
# └─ appsscript.json

これでローカルで編集可能です。なぜかgsだった拡張子がjsになります。
一度cloneしてしまえば、Gitと同じようにpull,pushができます。
スクリプトIDは.clasp.jsonに保持されます。

# ローカルの変更をリモートに反映
clasp push

# リモートの変更をローカルに反映
clasp pull

最後に

僕の職場ではGASを「ガス」って読んでいたんですけど、この前「ギャス」って呼ぶ人に出会いました。
皆さんはどっち派ですか?

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