CEPのパッケージ

head img
    Illustrator
    PremierePro
    InDesign
    AfterEffects

CEPのパッケージ

Extensionのパッケージ、配布などの際に必須となりますが手順がややこしく かなりの負担になるでしょう。とはいえ最後のテストでもパッケージ化が必要だったり知っておかないと 後々苦労することが沢山あります。今回あくまで基本的なパッケージ化はできる方向けの効率化などに関する記事で 初歩のパッケージ化に関することは書いていません。

パッケージ化の方法

まず開発者に署名が必要です。今回詳しくは述べませんが以下のサイトを参考に署名のファイルを 作成してください。

署名ファイルを作成後にパッケージ化となりますがここからが本記事の本題となります。

パッケージ化の方法

まずパッケージ化の手順の説明の前にパッケージ化において必要なファイルが以下になります。

  • manifest.xml
  • index.html
  • icon画像
  • CSInterface.js
  • jsファイル(パネル用のJavaScript)
  • cssファイル(パネル用のCSS)
  • jsxファイル、ExtendScript

勿論jsファイルやcssなどかなり簡単なパネルで済んだりhtmlに埋め込む限りは 必要ではありませんがとはいえ一般的には必須です。ここで重要なのは 余計ないファイルは含めないようにすることです。 例えば以下のファイルもパッケージ化においては不要になります。

  • .debug
  • package.json
  • .vscode(ExtendScript debuuger使用時などの設定ファイル)

.debugファイルを含めるとデバッグ環境が丸見えになったりしてあまりよろしくまりません。 その他パネル上に画像を表示させるときに画像ファイルを使ったりするのはいいのですが PSDファイルなど残したままパッケージ化するとパッケージ本体のファイルサイズが重くなるだけでなく 動かない原因になったりするので極力不要な画像ファイルも削除するようにしてください。

パッケージを行う

パッケージ化を行いますが必要なファイルのみを残した状態のフォルダを 用意します。なので元々のフォルダをコピーしてその上で不要なファイルを全て削除します。 そして作成した署名ファイルを使用とターミナルを使用してパッケージします。 詳しくは公式のドキュメントを参照してください。 結構骨の折れる 作業です。

パッケージ後の問題

パッケージ化が一度で終わればそれでいいのですが配布などを考えると以下のような ことが必要になるでしょう。

  • 実際に正しくパッケージ化されているか確認
  • 他のPC、もしくはOSでのテスト
  • 複数人でのテスト
  • 配布後、もしくは本運用後の修正

何度もパッケージ化を行う場合フォルダのコピー、不要なファイルの削除、コマンドの設定 と積み重なると相当な時間になります。プログラムが複雑になれば大体開発環境以外での テストも必要になると思います。

実際経験上以下のような問題に出くわしたことがあります。

  • WindowsとMacで片方のOSでしか動かない
  • 異なるPCで動かして初めて環境設定依存の問題に気づく

本番環境でのテスト時の注意

実際具体的な問題と対策に関して触れてゆきます。

デバッグモードをオフにする

CEP環境構築において初期の設定でMac、Windows両環境下でデバッグモードをオンにするこちらを参考のですが場合によってはオフにすると動かないということがあります。つまり開発環境下では動いたのに 別のPCにパッケージをインストールして動かない状態です。有名な症状が開発環境下のPCだと動いたのに 非開発環境下で動かしたら空のパネルが出てきたような症状がそれなりに報告されています。 なので本番テスト時は必ずデバッグモードをオフにした上で確認します。

WindowとMacでファイルパスの指定が異なり一部コードが動かない

誰しもが警戒する問題ではあります、とはいえ私もこれで結構な時間を溶かした経験があります。 実際のファイルパスの指定もそうですがcsInterface.evalScriptによる特定のExtendScript、jsxファイル を指定して実行する時にうまくいかないことがありました。

私の環境

まずパッケージ化は何度も行うので自前で開発したアプリでパッケージ化を自動化しています。私の場合 ReactやExtendScriptの環境構築のためwebpackでコンパイルしているのでフォルダ構造が複雑なので 余計に自動化ツールが必要でした。

自作のアプリケーションの画面
パッケージ自作のアプリケーション

公開はしていませんが不要なファイルと必要なファイルを自動で分けてフォルダーコピー、その後自動でパッケージ操作まで 行います。ファイルの仕分けも自動で行うので隠しファイル含めて余計なファイルが紛れることもありません。

インストーラー

外部Extensionおよびパッケージファイルをそのままインストールするのに必要な インストーラーですが代表的なもので二種類あります。

  • Anastasiy’s Extension Manager
  • ZXP/UXP Installer
  • 高機能なのはどちらかというとZXP/UXP Installerです。ただしZXP/UXP Installerの場合 特定のパッケージをアンインストールするとExtensionフォルダ内のコードのフォルダも一緒に 削除されることがあって開発者としとこの仕様はソースコードを消去してしまいそうで危険なので 普段はAnastasiy’s Extension Managerを使用しています。こちらはパッケージ本体のみが アンインストールされ開発中の同名のソースコードの入ったフォルダは削除しません。ただ 外部ユーザーにはどちらかというとZXP/UXP Installerを進めています。

    Windows版でパネルが表示されない時の対処法

    Mac環境下では問題なく動いていたのにWindowsにインストールしたらパネルが空っぽで動かないという 症状に悩まされたことがあります。ただWindows環境下でもデバッグモードをオンにしたら動きました。これに関してはZXP/UXP Installerのサイトでも触れられており、ZXP/UXP Installerにはこのデバッグモードをオンにする機能があるのであまりスマートではないですが 動くようにはなります。外部ユーザーで同様の症状にあった場合のために覚えておいた方が良いでしょう。

最後に

実はUXPだとこのあたりの問題はおおよそ解決されており、 デバッグモードののオンもアプリケーションにもよりますが単に環境設定のチェックボックスをクリックするだけだったり OS間の違いも解消されているように体感で感じます。パッケージ化で複雑な操作もありませんがまだまだ完全な実装までは 時間がかかりそうなのでしばらくはCEPとの付き合いも続くでしょう。