ビジュアルパーツをビルドし、サーバーにデプロイする¶

ワークスペース内のビジュアルパーツが完成したら、以下の手順でサーバーにデプロイします。

ビルドする
サーバーにデプロイする

このチュートリアルでは、ビジュアルパーツを https://<ご使用のintdashドメイン>/vm2m/data-visualizer/plugins/visual-parts-sample/app.js というURLでホストするものとして説明します。

ビルドする ¶

開発環境でビジュアルパーツをビルドします。

$ npm run build

ビルドの結果は、 ./build ディレクトリに出力されます。例：

app.js
c.1263149501256df91cb3.css
img.03113e5235a4e0c9f4b5aff3b51768c5.svg
img.640e2403b1c7131df59412174ed553ce.svg
img.b0745974cb47667e3eca2e18e294dc48.svg
licenses.txt

注釈

1つのワークスペースに含まれるビジュアルパーツは、ビルド作業によりまとめられ、1つの app.js ファイルになります。デプロイ（サーバーへの設置）は app.js ごとに行うため、ビジュアルパーツを個別にデプロイしたい場合は、ワークスペースを個別に作成する必要があります。
ビルド結果 app.js の冒頭には以下のようなライセンス情報のパスが出力されます。
```
/*! For license information please see ./licenses.txt */
```

サーバーにデプロイする ¶

注釈

ビジュアルパーツをサーバーにデプロイするには、サーバー側で設定変更やサービスの再起動を行う必要があります。

サーバー側の操作は、サーバー運用担当者が行います。アプトポッドにて運用を行っているサーバーの場合は、アプトポッドが行いますのでご依頼ください。

sshを使ってintdashサーバーに接続し、 ./build ディレクトリをintdashサーバーの任意のディレクトリにコピーします。

ここでは、 /home/web/visual-parts-sample 内にコピーするものとします。
intdashサーバーでNginxの設定ファイルを作成し、新しいビジュアルパーツプラグインのパスをlocationとして追加します。

設定ファイルは、 /etc/nginx/intdash.d/{任意のファイル名} としてください。ここでは、設定ファイルは /etc/nginx/intdash.d/visual-parts-sample とします。

設定ファイルの内容は、以下の通りです。
```
location /vm2m/data-visualizer/plugins/visual-parts-sample {
    alias /home/web/visual-parts-sample/build;
    auth_basic  off;
    auth_request  /_api_authn;
    error_page 401 = @redir_oauth2;
}
```
以下のコマンドを実行して、Nginxを再起動します。
```
# systemctl reload nginx
```
/etc/vm2m-dataviz-backend/visual-parts-plugins/ ディレクトリで、ビジュアルパーツの設定ファイルを以下のように作成します。

1つの app.js に対して1つの設定ファイルを作成することも、複数の app.js の設定を1つの設定ファイルにまとめることも可能です。複数の app.js の設定をまとめる場合は、配列 items に要素を追加してください。

例: /etc/vm2m-dataviz-backend/visual-parts-plugins/99.visual-parts-sample.json
```
{
  "items": [
    {
      "url": "/vm2m/data-visualizer/plugins/visual-parts-sample/app.js",
      "avoidSendingPartSpecificMetadata": true
    }
  ]
}
```
url
このビジュアルパーツのapp.jsファイルのパスを入力します。

avoidSendingPartSpecificMetadata
このビジュアルパーツ固有の情報（ビジュアルパーツ名など）を、収集される利用情報から除外するかどうかを設定します。

Data Visualizerでは、ユーザーがログイン時にアプリケーション利用情報の収集に同意すると、利用情報がGoogle Analyticsに送信されます。ただし、 avoidSendingPartSpecificMetadata が true になっている場合、このビジュアルパーツ固有の情報（ビジュアルパーツ名など）はGoogle Analyticsに送信されません。特別な理由がなければ avoidSendingPartSpecificMetadata は true にしてください。

注釈

設定ファイル名が . で始まる場合（例: .hidden_file.json ）や、ファイル名の末尾が .json ではない場合（例: sample.json.backup ）は読み込まれません。

管理しやすいよう、設定ファイル名は {数字}.{名前}.json とすることを推奨します。
注釈

Data Visualizerにビジュアルパーツの一覧が表示されるとき、並び順は以下により決定されます。
- 設定ファイルの名前順
- 同じ設定ファイル内では、 items に書かれている順
- 同じapp.jsファイル内では、書かれている順
グループの並び順は、上記の順序でビジュアルパーツが読み込まれたときの、groupNameの出現順です。

グループ内でのビジュアルパーツの並び順は、上記の順序でビジュアルパーツが読み込まれたときの、partsNameの出現順です。
以下のコマンドを実行して、Data Visualizerアプリケーションを再起動します。
```
# systemctl restart vm2m-dataviz-backend
```
これで、Data Visualizerから新しいビジュアルパーツを使用できるようになります。

以上でビジュアルパーツのデプロイは完了です。

注釈

サーバーにデプロイされたビジュアルパーツを使用する場合は、Data Visualizerの plg （Visual Parts Plugin Settings）ボタンは使用しません。

そのため、ビジュアルパーツの開発が完了したら、サーバー側の設定ファイル /etc/vm2m-dataviz-backend/vm2m-2nd-config.production.json は以下の状態にしてください。

{
  ...
  "devTools": {
    "showVisualPartsPluginSettings": false  <--
  },
  ...
}

設定ファイルを変更した場合は、変更を反映するため、サーバー上で以下のコマンドを実行し、Data Visualizerアプリケーションを再起動します。

# systemctl restart vm2m-dataviz-backend

ビジュアルパーツをビルドし、サーバーにデプロイする¶

ビルドする¶

サーバーにデプロイする¶

ビルドする ¶

サーバーにデプロイする ¶