[Google Apps Script] clasp 入門
clasp を利用すると、ブラウザ上のエディタではなくローカルファイルとして扱えます。
Git を利用したり、IDE の支援を受けながら開発することができます。
## インストール
`clasp` の利用には以下が必要です。
– npm or yarn
– node.js
`yarn` でグローバルインストールします。
“`prettyprinted
% yarn global add @google/clasp
yarn global v1.17.3
[1/4] 🔍 Resolving packages…
[2/4] 🚚 Fetching packages…
[3/4] 🔗 Linking dependencies…
[4/4] 🔨 Building fresh packages…
success Installed “@google/clasp@2.2.1” with binaries:
– clasp
✨ Done in 70.55s.
% clasp –version
2.2.1
“`
## 初期アカウント設定
プロジェクトディレクトリを用意し、`clasp login` を実行します。
ブラウザが開き、Google アカウントとの紐付けが確認されますので許可します。
“`prettyprinted
% clasp login
“`
このままプロジェクトを作成すると下記のエラーが表示されます。
“`prettyprinted
% clasp create
? Create which script? sheets
Created new Google Sheet: https://drive.google.com/open?id=foo
User has not enabled the Apps Script API. Enable it by visiting https://script.google.com/home/usersettings then retry. If you enabled this API recently, wait a few minutes for the action to propagate to our systems and retry.
“`
指示に沿って `https://script.google.com/home/usersettings` にアクセスして Google Apps Script API をオンにします。
## プロジェクトの作成
あらためて作成します。
`clasp create` で Google ドライブにファイルが生成されます。
`–title` オプションでファイル名を指定できます。
“`prettyprinted
% clasp create –title file_name
? Create which script?
standalone
docs
❯ sheets
slides
forms
webapp
api
“`
選択するとローカルに設定ファイルが生成されます。
Google ドライブにファイルが生成されます。
“`prettyprinted
% clasp create –title file_name
? Create which script? sheets
Created new Google Sheet: https://drive.google.com/open?id=foo
Created new Google Sheets Add-on script: https://script.google.com/d/foo/edit
Cloned 1 file.
└─ appsscript.json
“`
現在のローカルディレクトリは以下のようになっています。
“`prettyprinted
.
├── .clasp.json
└── appsscript.json
0 directories, 2 files
“`
`appsscript.json` を確認し、タイムゾーンを `Asia/Tokyo` に変更しました。
“`json:appsscript.json
{
“timeZone”: “America/New_York”,
“dependencies”: {
},
“exceptionLogging”: “STACKDRIVER”
}
“`
### scriptTitle は無効?
当初、ドキュメントにある `scriptTitle` を指定したのですが、
> This command creates a new script in the current directory with an optional script title. clasp create [scriptTitle]
>
> [Apps Script | Google Developers](https://developers.google.com/apps-script/guides/clasp)
“`prettyprinted
% clasp create project_name
“`
カレントディレクトリの一つ上、ファイルを収めている親ディレクトリ名のシートが Google ドライブに作成されていました。
エディタで編集できる `*.js` が変更されるのかとも考えたのですが反映されている箇所は見つかりませんでした。
影響はないのでペンディングとします。
“`prettyprinted
% clasp create –help
Usage: create [options]
Create a script
Options:
–type
–title
–parentId
–rootDir
-h, –help output usage information
“`
## 開発の流れ
`clasp pull` で `Code.js` をローカルに引っ張ります。
“`prettyprinted
% clasp pull
Cloned 2 files.
└─ appsscript.json
└─ Code.js
“`
内容はブラウザで編集していたあのファイルです。
“`javascript:Code.js
function myFunction() {
Logger.log(“Hello, World!”);
}
“`
編集が終わったら、ファイルをアップロードします。
`clasp push` でアップロードします。
“`prettyprinted
% clasp push
└─ Code.js
└─ appsscript.json
Pushed 2 files.
“`
以後は、`clasp push` を繰り返えす事で開発を進められそうです。
こうなると ES2015 で書きたい所ですが、[TypeScript を利用できるパッケージ](https://developers.google.com/apps-script/guides/typescript)が用意されていますので後日確認します。
### 既存のプロジェクトコードを clone する
既存プロジェクトのファイルを `clone` します。
> This command clones an existing project in the current directory. The script must be created or shared with your Google account. You specify the script project to clone by providing it’s script ID. You can find the script ID of a project by opening the project in the Apps Script editor and selecting File > Project properties > Info.
>
> [Apps Script | Google Developers](https://developers.google.com/apps-script/guides/clasp)
「ツール > スクリプトエディタ」を選択します。
「ファイル > プロジェクトのプロパティ」を表示し、`スクリプト ID` を控えます。
新しいディレクトリを作成し、既存のプロジェクトを `clasp clone` します。
“`prettyprinted
% clasp clone