Rocket.Chat Desktop Appのカスタマイズ手順を具体的に解説

Rocket.Chat Desktop Appは公開されているものをそのまま利用することも可能ですが、簡単なのでカスタマイズして利用することをおススメします。アイコンを好きなものに変更したり、初期起動時のサーバーURLの入力を省略したりできます。本記事では、具体的なカスタマイズ手順を解説します。

目次

環境整備

Windows10でRocket.Chat Desktop Appをカスタマイズする前提で説明をしていきます。まずは、必要なソフトウェアをインストールをします。

Node.jsのインストール

以下の記事を参考にNode.jsをインストールしてください。

Node.jsのインストール方法を図解解説(初心者向け)

gitのインストール

以下の記事を参考に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のインストールファイルが作成されます。

コメント

コメントする

目次