VSCodeを使ってGASの開発を行う方法【clasp】

GAS

claspとは

claspは、GASをターミナルから開発・管理するためのオープンソースのツールです。
clasp は GAS の操作をコマンドラインインターフェースで実現するツールです。

clasp は端末上から Google アカウントにログイン、ログアウトを実現し、コードの取得、デプロイが可能です。これによりローカルでの開発が可能となるので、 git でのコード管理や後述するプラグインを用いて VSCode 上で変数やメソッドの補完を容易にし、開発を効率化できます。

claspが使えるための環境を構築する

claspを使うためには、2つのインストールが必要

  • Node.jsのインストール
  • claspのインストール

Node.jsのインストール

以下のサイトから、Node.jsをインストールします。

Download | Node.js
Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

claspのインストール

VSCodeは、「表示」→「ターミナル」または「Ctrl+`」でターミナルが開きます。

npm install @google/clasp -g

ログイン・ログアウト

clasp login

GASを作成する

clasp create –title “Clasp Codelab”

以下のような画面が表示された場合は、Google Apps Script APIがオンになっていないのが原因です。

https://script.google.com/home/usersettings にログインして、Google Apps Script APIをオンにして、「clasp create –title “Clasp Codelab”」コマンドを実行

ファイルを作成して、アップロードする

clasp push

ブラウザを開いて確認

clasp open

VSCodeでシンタックスハイライトを付ける(GASファイルのコードの色付け)

設定から開く

「ファイル」→「ユーザー設定」→「設定」または「Ctrl+,」で設定を開きます。
右上の方のアイコンをクリックすれば「settings.json」が開きます。

コマンドパレットから開く

「表示」→「コマンドパレット」または「Ctrl+Shift+P」でコマンドパレットを開きます。
settingと入力して「基本設定:設定(JSON)を開く」をクリックします。
settings.jsonにコードを追加します。

{
  ・・・・
  "files.associations": {
    "*.gs": "javascript"
  }
}

これで、GASファイルのコードの色が変わります。

コメント