GAS開発をローカルのVSCodeでやる方法

はじめに

Google Apps Script（GAS）をブラウザのエディタで書くの、ちょっとつらくないですか？

実は、VS CodeでGAS開発ができるんです。しかもGoogle公式の方法で。

使うのは「clasp（Command Line Apps Script Projects）」。

これを使えば、ローカルで書いた .gs や .html ファイルをGoogle Apps Scriptと同期できます。

概要：claspとは？

claspはGoogle純正のCLIツールです。

VS CodeとGASをつなぐブリッジのような存在で、
こんなことができます：

・VS Codeでコードを編集
・clasp push でクラウドにアップロード
・clasp pull でクラウドの変更を手元に反映

つまり、ローカルで自由に開発できる環境をつくれるというわけです。

セットアップ手順（初回のみ）

① Node.jsをインストール

※環境によってまちまちなので、ChatGPTにインストールしたいって伝えて試してみてください

② claspをインストール

npm install -g @google/clasp

③ Googleアカウントでログイン

clasp login

ブラウザが開くので、Apps Scriptに使っているGoogleアカウントで認証します。

④ 既存プロジェクトと紐付け

Apps ScriptのURLにあるプロジェクトIDを使って、以下を実行します：

clasp clone <プロジェクトID>

これでローカルに .gs や .html ファイルが落ちてきます。
VS Codeで編集できます。

編集・同期コマンド

クラウド → ローカル：　clasp pull
ローカル → クラウド：　clasp push
新規プロジェクト作成：　clasp create --title "MyGASProject" --type webapp

ワークフロー例

# 初回のみ
clasp clone <projectId>

# 編集
code .

# アップロード
clasp push

# ブラウザで確認
clasp open

さいごに

VSCodeで編集環境作れれば、GitHubCopilotやCodexの拡張機能で、思う存分バイブコーディングができますね！
マイク片手に開発しましょう！

本文中に出てきた内容で、そこ飛ばしたらわかんないよーってことあれば、コメント下さい。順次補足していきます。