バンドルしたい(rollup)

$ rollup -c
$ rollup -c --watch

rollupは、JavaScript/TypeScriptをひとつのファイルにまとめるツールです。 GAS本体はモジュール化した構造を扱うことができません。 ローカルでモジュール開発し、GASにデプロイする前にrollupでひとつにまとめるという作業フローになります。

インストールしたい(rollup)

// devDependenciesに追加
$ npm install --save-dev rollup @rollup/plugin-node-resolve @rollup/plugin-typescript

rollup本体と関連するパッケージはdevDependencies(--save-dev)としてプロジェクトに追加すればOKです。

@rollup/plugin-node-resolveはnode_modules内のパッケージを解決するプラグイン、 @rollup/plugin-typescriptはTypeScriptを直接読み込んでバンドルするプラグインです。

スクリプト設定したい(package.json)

{
    "name": "...",
    "...": "...",
    "scripts": {
        "bundle": "rollup -c",
        "bundle:watch": "rollup -c --watch",
        "...": "..."
    }
}

npm scriptsのbundleとbundle:watchを設定したサンプルです。

$ npm run bundle
$ npm run bundle:watch

それぞれnpm run bundle、npm run bundle:watchで実行できます。 tscによる型チェック(tsc --noEmit)と役割が分かれるように、 buildではなくbundleという名前にしています。

設定したい(rollup.config.js)

 1import { nodeResolve } from "@rollup/plugin-node-resolve";
 2import typescript from "@rollup/plugin-typescript";
 3
 4export default {
 5    input: "src/index.ts",
 6    output: {
 7        file: "gas/code.bundle.js",    // .clasp.jsonと同じディレクトリに出力
 8        format: "iife",    // GAS向けにIIFE形式でまとめる
 9        name: "myLib",
10        sourcemap: true,
11    },
12    plugins: [
13        nodeResolve(),
14        typescript({ declaration: false, outDir: undefined }),
15    ],
16};

rollup.config.jsでrollupを設定できます。

typescript()プラグインが、tsconfig.jsonの設定を読みつつ.tsファイルを直接読み込んでバンドルします。 tscを別途実行してJavaScriptに変換しておく必要はありません。

注釈

tsconfig.json側でoutDirやdeclaration(型定義ファイルの出力)を指定していても、 rollupでバンドルする際は不要になるため、プラグインのオプションで打ち消しておくと安全です。