むむ、、、むずいですね。
以前のエントリーでExtendScriptの開発環境をWebpack+Typescriptで構築してみたりしたわけですが
CEPであれば一般的な計算(ツールに依存しないモノは全て)なども含む、
UIをhtml5、css3、jsでモダンに構築できることがわかったので環境をどう作るかで迷ったりはまったりしています。

本当であれば、js、jsx(Extendscriptの方)を含めTSで書き、Webpackでバンドルしてしまえればよいのですが
これはなんか、、、ちょっと難しいです w(理論的に説明できるほど熟練した時がきたら説明します)
TSを含め根本的なスキルがヨチヨチ歩きなのもあり、
リリースされて間もないTS対応のCSInterfaceをmoduleとして読み込んで
バンドルはできたとしても、Chromeのdevtoolsのコンソールで確認すると
constractorじゃねーぞみたないなことをいわれるし、
それをcursorのchatGPTに聞いてみても思うように解決してくれないので、
ひとまず(おそらく当面)はインラインで読み込む形になっています。

そういったこともあり、先述の通りextendscriptでは最低限のことしかさせず、
UIに限らず計算を含め可能なことはすべてjs側で処理してしまおうという考えにいたりました。
だって、npmやyarnを使ってNode.jsでmoduleで拡張していけば、やれることのレンジは膨大だと思いますし
尚且つ簡便に書くことができますからね。

現状でもPythonのpandasのようなmoduleを追加しバンドルしてみましたが
テキストエンコードと思われるエラーこそでますが、予想通りの結果が返ってきます。

ちなみに、色々といじっている間に気づいたことがあります。
html側にはリロード機能をつけUIのコーディングの修正・更新を確認できていましたが
当然Extendscriptの方は修正しても更新されることはありません。
毎回AEの再起動を強いられるのはものすごくだるいです。
Chromeのリモートデバックも再接続しなおさなきゃいけませんし。
こちらも、対応する方法があったのでhtmlと同時にjsxも更新できるようになりました。

ということでひとまずタイムラインローンチャーのCEP版を作ってみました。いやー、UI作るのがめっちゃ楽です。
scssでかけるのもありdebugの切り替えも容易に設定できますから、styleデザイン・開発の敷居が下がります。
ちょっとExtendScript仕様に比してカラフルすぎますが、テストも兼ねてる感じです。

CC Extension Builder

このvscodeの拡張機能はあるといいですね。
情報がweb上にも色々あるので初学者の導入にも良いと思います。
ちなみにデフォルトの作成場所では不便でかつ、別途任意に指定は不可だったりとか、
その他にもいくつかPatecはテンプレなどを少々カスタムしています。

ExtendScript Debugger

これは最初なくても、要所要所にアラート入れつつテストしたらなんとなく大丈夫かなーと思っていました。
見積もりがあめーってもんです。いつもながら我ながら過信しすぎです。
言い訳なんですが、この拡張機能はApple Silicon非対応で
Cursorに関してはUB版をいれていないので機能しないんですよね。
わざわざCursorのintel版を入れ直すのもなーと思いつつ開発をしていたんですがどうにもストレスフルです。
ということで考えました。

VSCodeのUBをいれました。というか以前入れたのがUB版だったので
こちらにExtendScript Debuggerを入れました。諸々、debugの設定をして使ってみます。
なんということでしょう。快適そのもの。随分昔に使用をやめていた
$.writeln()
も使えるようになるではありませんか。Apple Silicon Macユーザーの方も是非つかった方がよいです。
てか、つかってますよねw