/setup-clasp

description: "Lesson command"
duration: "約10分"
prerequisites: ["Node.js 18以上がインストール済み", "Googleアカウントを持っている", "ブラウザが使える"]
level: "beginner"
tags: ["setup", "gas", "clasp", "google"]
nonInteractiveMode: incompatible

Google Apps Script CLI (clasp) セットアップ

Step 0: セットアップ進捗の確認

**AIが自動実行する内容:** 1. `uv run python tools/setup_progress.py show --current setup-clasp` を実行して進捗を表示 2. 既存のインストール状態を自動検出:

• `npx -y @google/clasp --version` を実行
• clasp が既に利用可能で `npx -y @google/clasp list` が動作する場合、Step 5（テスト）のみ実行して完了にできる
• 未インストールの場合は Step 1 から開始

このセッションでやること

| 項目 | 内容 | |------|------| | ゴール | clasp (Google Apps Script CLI) をインストールし、OAuth認証を完了して、GASプロジェクトをローカルから作成・編集・デプロイできるようにする | | 所要時間 | 約10分 | | 前提条件 | Node.js 18以上がインストール済み、Googleアカウントを持っていること、ブラウザが使えること | | 操作レベル | CLIコマンド入力あり（npx で clasp 実行 + clasp login） | | 料金 | 無料 |

**このセッションの流れ:** 1. Node.js のバージョンを確認する 2. clasp を npx 経由で利用可能にする（グローバルインストール不要、AIが自動確認） 3. ブラウザで Apps Script API を有効化する（AIがブラウザを自動起動） 4. clasp login でOAuth認証を行う 5. 動作テスト（AIが自動実行）

> **ヒント**: AIの応答が途中で止まった場合は「続きを表示して」「止まってるよ」と入力すると再開します。

---

準備チェック

**AskQuestionの設定:**

{
  "title": "セッション開始前の確認",
  "questions": [{
    "id": "readiness",
    "prompt": "準備はできていますか？",
    "options": [
      {"id": "ready", "label": "準備OK！始めましょう"},
      {"id": "chrome", "label": "/chrome でブラウザ操作を自動化する"},
      {"id": "check_prereq", "label": "前提条件を確認したい"},
      {"id": "different_lesson", "label": "別のレッスンに移動したい"}
    ]
  }]
}

(ready → Step 1へ) (chrome → Step 3 でブラウザを開いた後、「Chrome 統合で自動化する場合」セクションの手順で自動実行する) (check_prereq → 「Node.js 18以上がインストール済みで、Googleアカウントでブラウザにログインできれば準備OKです。Node.jsの確認は次のステップで行います」と案内) (different_lesson → モジュール一覧を表示)

---

Step 1: Node.js の確認

**AIが実行すること:** 1. `node --version` を実行してNode.jsのバージョンを確認する 2. バージョンが18以上であることを確認する

**Node.jsが18以上の場合:** 「Node.js v{バージョン} を確認しました。Step 2 に進みます」と案内して Step 2 へ

**Node.jsが未インストールまたは18未満の場合のAskQuestion:**

{
  "title": "Step 1: Node.js のインストールが必要です",
  "questions": [{
    "id": "node_status",
    "prompt": "claspの実行にはNode.js 18以上が必要です。以下のURLからインストールしてください:\n\nhttps://nodejs.org/\n\n「LTS」バージョンのダウンロードボタンをクリックし、インストーラーの指示に従ってください。\n\nインストールが完了したら、ターミナルを再起動してください。",
    "options": [
      {"id": "installed", "label": "Node.js をインストールしました"},
      {"id": "help", "label": "インストール方法がわからない"},
      {"id": "skip", "label": "後で設定する（スキップ）"}
    ]
  }]
}

(installed → `node --version` を再実行して確認。18以上ならStep 2へ) (help → 「https://nodejs.org/ にアクセスして、緑色の "LTS" ボタンをクリックしてダウンロードしてください。ダウンロードしたファイルを開いて、画面の指示に従って進めるだけでインストールできます」と案内) (skip → 「claspのセットアップには Node.js が必要です。後で /setup-clasp を再実行してください」と案内して終了)

---

Step 2: clasp の利用確認

**AIが自動で実行すること:** 1. `npx -y @google/clasp --version` を実行して clasp が npx 経由で利用できることを確認する 2. 実行結果を確認する

> **補足**: グローバルインストール（`npm install -g`）は不要です。`npx @google/clasp` を使えば、常に最新版の clasp をインストールなしで実行できます。

**確認成功時:** 「clasp が npx 経由で利用可能です。Step 3 に進みます」と案内して Step 3 へ

**npx の実行でエラーが発生した場合のAskQuestion:**

{
  "title": "Step 2: npx の実行エラー",
  "questions": [{
    "id": "npx_error",
    "prompt": "npx @google/clasp の実行でエラーが発生しました。以下を確認してください:\n\n1. Node.js と npm が正しくインストールされているか\n2. ネットワーク接続が有効か（npx は初回実行時にパッケージをダウンロードします）",
    "options": [
      {"id": "retry", "label": "もう一度試す"},
      {"id": "check_node", "label": "Node.js の確認に戻る（Step 1）"},
      {"id": "help", "label": "他の方法を知りたい"}
    ]
  }]
}

(retry → `npx -y @google/clasp --version` を再実行。成功したらStep 3へ) (check_node → Step 1 に戻る) (help → 「ネットワーク接続を確認してください。プロキシ環境の場合は npm のプロキシ設定が必要な場合があります」と案内)

---

Step 3: Apps Script API の有効化

**AIが実行すること:** 1. OSを自動判定する（Mac / Windows / Linux） 2. 以下のコマンドを実行してブラウザを自動起動する:

# Mac:
open https://script.google.com/home/usersettings
# Windows:
start https://script.google.com/home/usersettings
# Linux:
xdg-open https://script.google.com/home/usersettings

**ブラウザが開いたら、以下のAskQuestionを表示:**

{
  "title": "Step 3: Apps Script API を有効化",
  "questions": [{
    "id": "api_status",
    "prompt": "ブラウザが開きましたか？以下の手順で Apps Script API を有効化してください:\n\n1. Googleアカウントでログインする\n2. 「Google Apps Script API」のトグルスイッチを探す\n3. トグルを「オン」に切り替える\n\n※ 既にオンになっている場合はそのままでOKです。\n\n完了しましたか？",
    "options": [
      {"id": "done", "label": "APIを有効化しました！（または既にオンでした）"},
      {"id": "browser_not_open", "label": "ブラウザが開かない"},
      {"id": "no_toggle", "label": "トグルスイッチが見つからない"},
      {"id": "org_restriction", "label": "組織の管理者によって制限されていると表示される"}
    ]
  }]
}

(done → Step 4へ) (browser_not_open → 「ブラウザで直接このURLを開いてください: https://script.google.com/home/usersettings」と案内) (no_toggle → 「ページ中央付近に "Google Apps Script API" という項目と、オン/オフのトグルスイッチがあります。ページを下にスクロールしてみてください。見つからない場合は、Googleアカウントでログインしているか確認してください」と案内) (org_restriction → 「Google Workspaceの組織管理者がApps Script APIを無効にしている可能性があります。個人のGmailアカウント（xxx@gmail.com）でログインし直してみてください。組織アカウントで使う必要がある場合は、IT管理者にApps Script APIの有効化を依頼してください」と案内)

---

Chrome 統合で自動化する場合（`/chrome` モード）

**前提条件:** Chrome に「Claude in Chrome」拡張機能（v1.0.36+）がインストール済みで、`claude --chrome` で起動しているか、セッション内で `/chrome` を実行済みであること。

**AIが Chrome 統合で自動実行する内容:** 1. ブラウザで https://script.google.com/home/usersettings を開く 2. Chrome 統合を使って以下の操作を実行する:

• 「Google Apps Script API」のトグルを見つける
• トグルが OFF の場合は、クリックして ON に切り替える

3. トグルが ON になったことを確認し、Step 4 に進む

Chrome 統合が利用できない場合は、Step 3 の手順を手動で実行してください。

---

Step 4: clasp login（OAuth認証）

**AIが自動で実行すること:** 1. `npx -y @google/clasp login` を実行する 2. ブラウザが自動で開き、Googleアカウントの認証画面が表示される

**AskQuestionの設定:**

{
  "title": "Step 4: Googleアカウントで認証",
  "questions": [{
    "id": "login_status",
    "prompt": "clasp login を実行しました。ブラウザでGoogleアカウントの認証画面が表示されます:\n\n1. 使用するGoogleアカウントを選択する\n2. 「許可」をクリックしてclaspにアクセス権限を付与する\n3. ターミナルに「Authorization successful.」と表示されたら完了\n\n認証は完了しましたか？",
    "options": [
      {"id": "done", "label": "「Authorization successful.」と表示されました！"},
      {"id": "browser_not_open", "label": "ブラウザが開かない"},
      {"id": "permission_denied", "label": "「このアプリはブロックされています」と表示される"},
      {"id": "timeout", "label": "認証画面が表示されたが、ターミナルが反応しない"}
    ]