Rocket.Chat Desktop Appは公開されているものをそのまま利用することも可能ですが、簡単なのでカスタマイズして利用することをおススメします。アイコンを好きなものに変更したり、初期起動時のサーバーURLの入力を省略したりできます。本記事では、具体的なカスタマイズ手順を解説します。
環境整備
Windows10でRocket.Chat Desktop Appをカスタマイズする前提で説明をしていきます。まずは、必要なソフトウェアをインストールをします。
Node.jsのインストール
以下の記事を参考にNode.jsをインストールしてください。
gitのインストール
以下の記事を参考にgitをインストールしてください。
yarnのインストール
JavaScriptのパッケージ管理システムのyarnをインストールします。同じくパッケージ管理システムであるnpmより推奨するとGitHubに記載がありました。
Git Bashを起動します。
npm install -g yarn
と入力してエンター
これで、Rocket.Chat Desktop Appをカスタイマイズする下準備が整いました。
Rocket.Chat Desktop Appのカスタマイズ
Git Bashを起動して、以下のコマンドよりGitHubよりプログラムをクローン展開します。ローカルに複製コピー
git clone https://github.com/RocketChat/Rocket.Chat.Electron.git
以下コマンドでRocket.Chat.Electronのフォルダに移動します。
cd Rocket.Chat.Electron
GitHubの手順ではアプリ作成時にエラーが出ました。
色々と調べた結果、展開されたフォルダ内の二つのJavaScriptを以下のように修正して解消させました。(結構ハマった、元のソースはhttps://github.com/RocketChat/Rocket.Chat.Electron/issues/1917)
rollup.config.jsの15行目を以下の様に修正
const NODE_ENV = process.env.NODE_ENV || ‘production‘;
package.json の 27行目を以下の様に修正
release”: “yarn electron-builder –publish never –x64″
以下コマンドを実行します。
yarn
Rocket.Chat.Electronフォルダ内のソースコードや設定ファイルを変更します。
以下コマンドでアプリをビルドします。
yarn build
ビルド後のRocket.Chat Desktop Appを以下コマンドで確認してください。
yarn start
以下コマンドでアプリを作成します。
yarn release
Rocket.Chat.Electron>dist 内にカスタマイズしたRocket.Chat Desktop Appのインストールファイルが作成されます。
コメント