【要約】GASをTypeScriptで書いてesbuild + claspでデプロイする環境を作る [Qiita_Trend] | Summary by TechDistill
> Source: Qiita_Trend
Execute Primary Source
// Problem
GASの標準エディタを利用する開発者は、生産性を阻害する複数の制約に直面している。従来のブラウザ上での開発では、以下の問題が発生する。
- ・型定義の欠如：TypeScriptが利用できず、実行時エラーのリスクが高い。
- ・モジュール管理の困難さ：外部ライブラリやコードの分割管理が容易ではない。
- ・バージョン管理の限界：Gitを用いたチーム開発や履歴管理が困難である。
// Approach
著者は、モダンなフロントエンド開発に近いワークフローをGASに導入することで、これらの課題を解決している。具体的には以下のステップで環境を構築する。
- ・TypeScriptの導入：型安全なコーディングを実現するためにTypeScriptを採用する。
- ・esbuildによるバンドル：高速なビルドを実現するため、esbuildを用いてソースを単一ファイルに集約する。
- ・グローバルスコープへの露出：GASの制約に対応するため、esbuildのfooter機能で関数をglobalThisに紐付ける。
- ・claspによるデプロイ自動化：claspを用いて、ビルド済みの成果物をローカルからGASへ直接転送する。
// Result
開発者は、ローカル環境で高度な開発機能を利用しながら、容易にGASへコードを反映できるようになった。構築後の成果は以下の通りである。
- ・開発効率の向上：npm scriptsにより、ビルドからデプロイまでを一括実行できる。
- ・コード品質の担保：TypeScriptによる静的解析が可能になる。
- ・管理コストの低減：Gitによるソースコードの履歴管理が実現する。
Senior Engineer Insight
> DX（開発体験）を劇的に改善する優れた構成である。esbuildの採用は、ビルド待ち時間を最小化する点で実戦的だ。特に、esbuildのfooterで関数をグローバルに露出させる手法は、GASの仕様を深く理解した賢明な実装である。ただし、大規模化に備え、Jest等を用いたユニットテストの導入を検討すべきだ。また、distディレクトリをGit管理外に設定する運用も徹底が必要である。