Help us understand the problem. What is going on with this article?

Container Bound Scriptをclaspで管理

More than 1 year has passed since last update.

Container Bound Scriptとは?

公式ページ

Google Apps Script のプロジェクトでスプレットシートに紐付くプロジェクト。
Container Bound Scriptと逆のGoogleドライブ上に単独で存在するStandalone Scriptがある。

:computer:環境構築


  1. Google Drive上でスプレットシート新規作成し、「ツール」>「スクリプトエディッタ」を選択します
    image1.png

  2. スクリプトエディッタ上で「ファイル」>「保存」でプロジェクト名を設定し保存します

  3. 手元でclaspを使って環境を構築します

    $ yarn add @google/clasp cpx gas-webpack-plugin tslint @types/google-apps-script @types/node ts-loader ts-node webpack webpack-cli --dev
    
  4. claspでログインしてない場合はログインを行います

    $ ./node_modules/.bin/clasp login
    

    ブラウザが立ち上がるので対象のアカウントでログインを行います
    claspの初期設定等はここでは省略

  5. .clasp.jsonscriptId に作成したスクリプトのIDを設定します

:pencil: 実装


簡単なサンプル

簡単にできる「スプレットシート開いたらメニューを追加する」をやってみたいと思います。

declare var global: any;

global.onOpen = (): void => {
  SpreadsheetApp
    .getUi()
    .createMenu('Test')
    .addItem('ホゲホゲする', 'showDialog')
    .addToUi();
}

global.showDialog = (): void => {
  Browser.msgBox('メニューからダイアログ表示');
}

デプロイしてリロードするとメニューが表示されています。
image2.png

メニューをクリックするとダイアログが表示されます。
image3.png

編集された時のEventの値をダンプ

global.onEdit = (e: any): void => {
  const range: GoogleAppsScript.Spreadsheet.Range = e.range;
  const authMode: GoogleAppsScript.Script.AuthMode = e.authMode;
  const oldValue: any = e.oldValue;
  const source: GoogleAppsScript.Spreadsheet.Spreadsheet = e.source;
  const triggerUid: number = e.triggerUid;
  const user: GoogleAppsScript.Base.User = e.user;
  const value: any = e.value;

  Logger.log(`range: ${range.getValue()}`);
  Logger.log(`authMode: ${authMode}`);
  Logger.log(`oldValue: ${oldValue}`);
  Logger.log(`source: ${source.getName()}`);
  Logger.log(`triggerUid: ${triggerUid}`);
  Logger.log(`user: ${user.getEmail()}`);
  Logger.log(`value: ${value}`);
}

スプレットシートのセルを編集してみた結果が以下です :eyes:
image4.png
↑なぜか triggerUidは取得出来ず。。

ひとまずclaspでContainer Bound Scriptを管理できるようになったので、
テスト等も書けて良い感じになりました :sparkles:

:bomb: バッドノウハウ


  • html-webpack-pluginで以下のエラーが発生
Child html-webpack-plugin for "index.html":
     1 asset
    Entrypoint undefined = index.html

意味のない警告なので無視していいらしいです。。
https://github.com/jantimon/html-webpack-plugin/issues/895#issuecomment-379006202

:link: 参考リンク


Slowhand0309
Android, iOS, Rails, C/C++, Typescript
sikmi
しくみ製作所株式会社は、世の中の「しくみ」を素敵にするためのソフトウェア開発集団です。オフィスのない弊社は、メンバー全員リモートワークです!
https://sikmi.com/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away