VSCodeを使ったGoogle Apps Script開発の環境構築
はじめに
この記事では、VSCodeでGoogle Apps Script(以下GAS
)開発の環境を構築する方法を紹介します。GASを開発するためにはGoogleアカウントが必要になるので、もしお持ちでない方は先に作成してください。また、ローカルからGoogleアカウントにアクセスするためにclasp
というNode.jsパッケージを使うので、Node.jsも必要になります。詳細は以下のドキュメントをご覧ください。
最終的なディレクトリ構成
myApp/
├── .clasp.json
├── .claspignore
├── appsscript.json
└── main.js
Google Apps Script APIを有効にする
まずはGAS APIを有効にしましょう。使いたいアカウントにログインした上で設定してください。以下からアクセスできます。
プロジェクトディレクトリの作成とパッケージのインストール
mkdir myApp
cd _$
npm init -y
npm i -g @google/clasp # claspはグローバルにインストールする
claspでGoogleアカウントにログインする
clasp login
このコマンドを実行するとブラウザでアカウント認証画面が開きます。先程のGAS APIを有効にしたアカウントを選択し、指示に従って進めてください。成功すると以下のようなメッセージが表示されます。以降はclaspコマンドでローカルからGoogleアカウントにアクセスして、GASソースコードのアップロード・ダウンロードなどができるようになります。
アプリケーションの新規作成と設定
以下のコマンドで新しくアプリケーションを作成します。
clasp create --type standalone
するとプロジェクトルートに以下のファイルが作成されます。
-
.clasp.json
claspの設定ファイル -
appsscript.json
GASの設定ファイル
またアカウントのGoogle Driveにもアプリケーションが作成されているので確認してみてください。
appsscript.json
のtimeZoneを日本に変更します。
{
+ "timeZone": "Asia/Tokyo",
"dependencies": {
},
"exceptionLogging": "STACKDRIVER",
"runtimeVersion": "V8"
}
.claspignore
ファイルを作成します。後でアプリケーションをGoogleにアップロードする工程があるのですが、これはその時にアップロードしたくないファイルやディレクトリを指定するためのものです。.gitignore
のようなものですね。
以下はmain.js
とappsscript.json
以外の全てを無視する設定です。
**/**
!main.js
!appsscript.json
main.jsを作成します。今回はログを出力するだけの簡単なコードです。
const test = () => {
console.log("Hello GAS!");
}
Googleにアプリケーションをアップロードする
ではいよいよ、Googleにアプリケーションをアップロードします。
clasp push
成功すると以下のようなメッセージが表示されます。
次に以下のコマンドを実行すると、今アップロードしたGASのwebエディターがブラウザで開きます。
clasp open
この時、main.js
はmain.gs
へ自動的に変換されています。実行ボタンを押してログが表示されれば成功です🎉 お疲れ様でした!
おわりに
ローカルで開発すればエディターによる拡張機能の恩恵も受けられますし、Githubでのコード管理も楽になると思います。ぜひやってみてください。
最後まで読んでいただきありがとうございました!!
Discussion