Adobe JSXと違ってCEP周りの環境は日々進化しています。既に3,4年前に比べて開発環境が大きく変わったのでここに私の開発環境を書いておきます。 テキストエディター 今から始めるならVSCode一択でしょうか。Extend script debuggerのプラグインでJSXのデバッグもできます。CC Extension BuilderでCEPの雛形も作ってくれます。Adobe bracketsは一時期人気がありましたが今はどうでしょうか？だんだん古い情報しか検索に引っかからないようになりました。 デバッグ 2020年上旬あたりに突然Google chromeでCEPでのデバッグが出来なく
Adobe extensionを開発しているとformを扱う事が多くなります。jsxから数値を取得して、それをパネル上で表示して、数値を入力またjsxにアクセスしたり。デフォルトのtopcoatのcssは基本の設定が揃っていて便利ですがhtml構造が少し難しくなりがち。 前回説明したようにcheckboxやradiobuttonはlabel要素の中にdivが混じっていたりと少し複雑です。ここら辺のコードは柔軟なCEPを開発しようと思うと何度も触れる部分なので普段からまとめられると便利です。例えば以下のようなリストをjsで作るとしましょう。 各種input要素等を囲ったlabel要素があってその
今回はトランスパイルやら何やらの環境構築をしたいと思います。前述の通りCC2017ですらECMA2015もまともに動かないのでAdd on等で公開する事を前提に開発する私としてはトランスパイル自体必須の作業です。 ここの階層にmoduleなんかを設置していきます。というわけでまずはpackage.jsonを作成 トランスパイラですが私はいつもwebpackで環境構築しています。babelのついでにCSS向けのベンダープレフィックス対策やsassの使用環境構築なんかもしてゆきます。このあたりの環境構築に関しましてはicsさんの記事を参考にしました。 babelのインストール。 sass load