プラグイン向け Web SDK

概要

続くセクションでは、プラグイン向け Web SDK の概要を説明します。これにより、次のことができるようになります。

  • 独自のプラグインによるアプリケーションの拡張
  • Things Cloud のアプリケーションへのアプリケーションの追加
  • カスタムウィジェットによるデータ可視化の改善
  • ユースケースに応じた機能の実装

アーキテクチャ

上図では、アプリケーションやプラグイン開発の背景となるアーキテクチャを示しています。コアアプリケーションと同様に、AngularJS や Cumulocity の提供する "c8y.core", "c8y.ui" JavaScript API 上に構築できます。これらのモジュールによって、Things Cloud Webアプリケーションへのアクセスサービスが提供されます。"c8y.core" モジュールはユーザー、マネージドオブジェクトのような異なるデータ種別へのアクセスサービス、そして基本機能を提供するのに対し、"c8y.ui" はアプリケーションやプラグインのユーザーインターフェースの修正(例えばメニューアイテムやウィジェットの追加)のサービスを提供します。モジュールは、Things Cloud で提供される REST API を組み合わせて利用しています。プラグイン例でどのようにこれらのサービスを利用するかの例が示されます。

まず、この文書では、アプリケーションやプラグインの背後にあるコンセプトを説明します。そして必要とされるフォルダ構成とアプリケーションやプラグインで異なるオプション設定を規定します。続いてアプリケーションとプラグインを開発するのに必要なセットアップが書かれています。プラグイン向け Web SDK は次のような構成です:

その後、サンプルプラグインの作り方を順を追って説明します:

次の文書には、別のもっと複雑な例があります:

この章でアプリケーションとプラグインのコンセプトの概要が説明されますが、アプリケーション開発に記載される Things Cloud アプリケーションの基本コンセプトを見ておくことをお勧めします。

コンセプト

アプリケーションやプラグインを構築する前に、アプリケーションやプラグインとは何かを正しく理解することが重要です。この意味で、アプリケーションは Cumulocity UI フレームワークをベースとし、Things Cloud UI をつくっています。デフォルトでは、Things Cloud UI は3つのコアアプリケーション、つまり "デバイス管理"、"アドミニストレーション", "コックピット" で構成されています。そして、アプリケーションはプラグインで構成されています。プラグインはアプリケーションに追加したいすべての機能を表現しています。プラグインでできることは以下です:

  • ブランドの変更
  • メニューへの新しいナビゲーション項目の追加
  • ダッシュボードへの新たなウィジェットの追加
  • ドロップダウンメニューへの新たなメニュー項目の追加
  • グループやデバイスの新しい表示やタブの追加
  • 他の追加したいあらゆる種類の機能(例えば検索)

下に画面を示します:

プラグインの拡張箇所

例として、"コックピット" アプリケーションが利用しているプラグインリストの抜粋を見てみましょう。以下が含まれます:

  • コックピットホーム:ナビゲータに "ホーム" メニューを追加するプラグイン
  • ダッシュボード:グループやデバイスに対し、表示やタブを追加するプラグイン。ウィジェットのコンテナとして機能
  • データポイントテーブル:ダッシュボードへの表形式でメジャーメントを可視化するウィジェットを追加するプラグイン
  • その他

Things Cloud のコアアプリケーション(アドミニストレーション、コックピット、デバイス管理)の機能をを拡張 できることに注意してください。通常のテナントでは、拡張前にコアアプリケーションの複製を作成しなければなりません。アプリケーションの複製は、"アドミニストレーション" の UI 経由で複製するか、任意のアプリケーションとして同一のプラグインを使った新たなアプリケーションを作成するかのいずれかでできます。

プロジェクト構成

新しいアプリケーションやプラグインを作成するときは、必ず次のフォルダ構成に従わなければなりません。従わない場合、アプリケーションやプラグインが動作しないことがあります。 アプリケーションのデフォルトのフォルダ構成は以下の通りです:

<<root folder>>
├── cumulocity.json
|    ...
└── plugins
        └── <<plugin name>>
                ├── cumulocity.json
                └── index.js
            ...

アプリケーションのフォルダ内には、"アプリケーションマニフェスト" と呼ぶ情報が "cumulocity.json" ファイルに格納されます。"plugins" フォルダには、アプリケーションによって提供されるプラグイン単位のフォルダが含まれています。プラグインのフォルダ名は、アプリケーション名と合わせて一意になっています。プラグインフォルダには、"プラグインマニフェスト" と呼ぶ情報が別の "cumulocity.json" ファイルに格納されます。アプリケーションマニフェストとプラグインマニフェストのフォーマットは以下に記載されています。 プラグインを既存アプリケーションに追加するだけでよい場合、上述のフォルダ構成の一部を使います:

<<root folder>>
└── <<plugin name>>
        ├── cumulocity.json
        └── index.js
        ...

プロジェクト用の明示的なルートフォルダを作成してください。 Web SDKは、ルートフォルダの親フォルダがオペレーティングシステムのユーザーに読み取り可能であることを前提とします。

マニフェスト

アプリケーションマニフェスト

アプリケーションマニフェストは、アプリケーションがどこに格納されているか、またThings Cloudでどのように見られるかが記述されています。次のプロパティが利用できます:

  • name: アプリケーションの表示名。アプリケーションスイッチャーに表示されます。
  • availability: アプリケーションをあなたのテナントだけで利用可能とする場合 "PRIVATE"、一般のアプリケーションの場合、"MARKET"
  • contextPath: ホストされるアプリケーションに使用されるパス。アプリケーションのURLは "<<yourURL>>/apps/<<contextPath>>" となります。
  • key: アプリケーションのリクエストをアプリケーションと関連付けるため、またアプリケーション登録するために使用されるアプリケーション・キー。
  • resourcesUrl: アプリケーションがzipファイルアップロードで提供される場合(Smartappが該当)、この値は '/' となります。フルURLの場合、リクエストはそのアドレスに行われます。
  • type: アプリケーションが Things Cloud 内でホストされる場合は HOSTED、アプリケーション別の場所でホストされる場合は EXTERNAL
  • imports: アプリケーションが使用するプラグインのリスト。<<applicationName>>/<<pluginName>> のリスト。
  • noAppSwitcher: [オプション] true に設定すると、アプリケーションはアプリケーションスイッチャーに表示されません。想定される用途は、例えばアプリケーションがプラグインを提供するだけの場合です。
  • options:
    • hide_navigator: [オプション] 論理値で、true とするとデフォルトで左にあるナビゲータメニューを折りたたんだ状態で表示します。
    • globalTitle: [オプション] A title that will be used as the global title of the Web application.

注記:"contextPath" と "key" は一意である必要があります。"PRIVATE" アプリケーションの場合、"name" と "contextPath" はあなたのテナント内のみで一意である必要があります。

プラグインマニフェスト

プラグインマニフェストとは、あなたのプラグインの Things Cloud アドミニストレーション・アプリケーション内での表示方法(名称、説明、カテゴリー、ギャラリー、リスト)と、プラグインを実行するためにビルドおよびロードされる必要のあるファイル(ngModules、js、imports、css、less、copy)を示すものです。

  • name: プラグインの表示名で、必須。
  • description: [オプション] プラグインのより詳しい説明。
  • category: [オプション] ユーザーインターフェース内で使用されるプラグインのカテゴリ。
  • ngModules: プラグインによって提供される AngularJS モジュールのリスト。最低1つは必要です。
  • js: [オプション] "index.js" のようなロードする JavaScript ファイル。コントローラ、サービス、asfを含む。パスはプラグインのルートフォルダからの相対パス。
  • css: [オプション] ロードする CSS ファイルのリスト。パスはプラグインのルートフォルダからの相対パス。
  • less: [オプション] ロードする LESS ファイルのリスト。パスはプラグインのルートフォルダからの相対パス。
  • copy: [オプション] ビルドに含める際にコピーするファイルのリスト。

マニフェストファイルの内容の多くはリファレンスに記載されるアプリケーションAPIプロパティに関するものです。マニフェストファイルの例はexamplesにあります。

セットアップ

前提条件

プラグインはHTML5 をベースとしており、以下の技術に精通していることが望ましいでしょう:

プラグインを開発し、実行するための前提条件は以下の通りです。

  • Node.js (6.7 or newer)
  • npm (Node.js と一緒にインストールされます)
  • Things Cloud アカウントへのアクセス。つまり、テナント名、ユーザー名、パスワードが必要です。

Cumulocity CLI ツール

前提条件が満たされれば、独自のアプリケーションとプラグインのビルドの準備はほとんどできたようなものです。プラグイン開発(ビルド、テーマ設定、変換、デプロイ)の処理には、npm パッケージ "cumulocity-tools" がコンピュータにインストールされている必要があります。npm パッケージのインストールには、次のコマンドをターミナルで実行してください。

$ npm i cumulocity-tools -g

これでコマンドラインインターフェース(CLI)ツールが利用できるようになります。次のコマンドを試してみてください:

$ c8y --help

"--help" オプションは、CLIツールで使えるすべてのコマンドを表示します。

Cumulocity UI パッケージ

上述のように、アプリケーションはプラグインの集まりです。プラグインセットが準備されており、独自のものを追加ビルドすることができます。ですがその前に、"package.json" ファイルをアプリケーション用のフォルダに追加する必要があります。"package.json" を自動生成するには、次のコマンドを実行します:

$ npm init

注記:このコマンドでは "package.json" ファイルに含めるいくつかのプロパティの値を入力する必要があります。"package.json" ファイルは少なくとも name と version を含める必要があります。プロパティ入力をスキップする場合、enter キーを押してください。

続いて、次のコマンドを入力して、プラグインセットを含む Cumulocity UI のインストールを続けてください:

$ c8y install << uiバージョン >>

このコマンドでは:

  • 指定したバージョンのCumulocity UI パッケージをチェックします。
  • パッケージをダウンロードします。
  • "package.json" ファイル内の dependency として追記します。

このバージョンはバックエンドのバージョン番号と同じか、それより小さくなければなりません。

注記:プロジェクトを共有する場合、他の開発者はアプリケーションプロジェクトのルートフォルダ内で npm install を実行すれば大丈夫です。それは、Cumulocity UI パッケージのバージョンはすでに "package.json" ファイルに dependency として定義されているからです。c8y install を走らせればいつでも他のバージョンをインストールできます。

アプリケーションのプラグインリストを見るには、 "c8y util:showimports [appContextPath]" とします。

サンプルプラグイン

全てのセットアップとフォルダ構成、マニフェストについて理解したら、最初のアプリケーションプラグイン"Hello World!" を走らせることができます。

  • 次の url から "Hello World!" プラグインを複製、またはダウンロードし、解凍します。 https://bitbucket.org/m2m/cumulocity-ui-plugin-examples.
  • 作成したディレクトリに移動します。
  • Cumulocity UIパッケージをインストールするために "c8y install << uiバージョン >>"を実行してください。
  • "c8y deploy:app myapplication" を実行してください。"myapplication" は "cumulocity.json" ファイルで指定された "Hello World!" アプリケーションの名前です。

name テナントのベース URL が聞かれ、またユーザー名、パスワードも聞かれます。これらのプロンプトに毎回入力するのを避けるには、次の環境変数を設定してください。 C8Y_TENANT, C8Y_USER, C8Y_PASS, C8Y_BASE_URL たとえば、Unix システムで "export C8Y_TENANT=demos" と入力すると、デフォルトでテナント "demos" にアプリケーションが作成されます。

アプリケーションデプロイ後、Things Cloud の "アドミニストレーション" アプリケーションの中で、"所有アプリケーション" メニューがあらわれます。

My Application

"Hello World!" プラグインを見るには、作成したサンプルに移動し、"New plugin" メニューを選択してください。あなたは "Hello World!" という文章をみることができます。他のプラグイン例も試すことができます。プラグイン例の詳細については、サイトの各文書を参照してください。

"Hello world!"

このプラグインの目的は、新しいアプリケーションをアプリケーションスイッチャーに追加することです。このアプリケーションはユーザーが1つのメニュー項目をクリックすると "Hello World!" ページを表示するものです。最後に、このアプリケーションは次のように見えます:

Hello world プラグイン

このゴールまでに、次のステップが必要です:

  • アプリケーションプロジェクトのセットアップ
  • アプリケーションマニフェストの設定
  • テナントへのアプリケーションの生成
  • プラグインマニフェストの設定
  • メニュー項目を追加し、表示テンプレートに関連付けるプラグインの初期化関数の実装
  • 表示テンプレートに対し、データを提供するコントローラーの実装(この場合簡単なテキストの提供)
  • データを表示するための表示テンプレートの追加
  • アプリケーションのテスト
  • 最後に、アプリケーションとプラグインをビルドして公開

アプリケーションプロジェクトのセットアップ

まず、アプリケーションプロジェクトを以下の手順で作成してください:

  • 任意の名前でフォルダを新規作成
  • アプリケーションマニフェストとして、"cumulocity.json"ファイルをフォルダ内に作成
  • 新規"package.json"を作成するために"npm init"コマンドを走らせる
  • 最新のコアプラグインを入手するために"c8y install latest"コマンドを走らせる

上記の手順を踏むと以下のフォルダ構造となっているはずです:

<<root folder>>
├── node_modules
|        └── ...
├── cumulocity.json
└── package.json

アプリケーションマニフェストの設定

次に、アプリケーションマニフェスト(rootフォルダ内の"cumulocity.json"ファイル)の名称、キー、URL、依存関係などの Cumulocity アプリケーション情報を埋めてください。今回の例では、以下のプロパティを設定する必要があります:

    {
        "availability": "PRIVATE",
      "contextPath": "myapplication",
      "key": "myapplication-appkey",
      "name": "myapplication",
      "resourcesUrl": "/",
      "type": "HOSTED",
        "imports": [
            "core/c8yBranding"
        ]
    }

ここまでのプロジェクト構造があればアプリケーションの検証が可能です。"c8yBranding"プラグインをThings Cloud UIパッケージからインポートへ追加すれば、アプリケーションへアクセスする時、完全に空という状態ではなくなります。呼称でもおわかりのように、このプラグインはThings Cloudのブランディングを自身のアプリケーションへ追加します。 アプリケーションをローカルで検証する場合は最初に自身のテナント内にそれを作成する必要があります。

マニフェストの他のプロパティの詳細については"Manifests"をご参照ください。

自身のテナント内にアプリケーションを作成する

Things Cloud のUIアプリケーションへのログインに成功するとアプリケーション・キーは自動的に取得されます。即ち、アプリケーションを開発する場合自身のテナントで作成する必要があります。自身のテナント内でアプリケーションを作成するにはc8y deploy:app [appContextPath]を使用して展開してください。 appContextPathを削除した場合、contextPathはコマンドが実行されたパスの"cumulocity.json"から読み取られます。 

$ c8y deploy:app myapplication
? Tenant piedpiper
? User admin
? Password ***********
? Base url https://piedpier.cumulocity.com
GET application/applicationsByOwner/piedpier?pageSize=10000 200
POST application/applications/31337/binaries/ 201
PUT /application/applications/31337 200

テナント名、テナントのベースURL、ユーザー名、パスワードをそれぞれ請求されます。このようなプロンプトを繰り返し入力することを避けたい場合は以下の環境変数を定義すると良いでしょう: C8Y_TENANTC8Y_USERC8Y_PASSC8Y_BASE_URL.

アプリケーションのデプロイすると、"アドミニストレーション" アプリの "カスタムアプリ " メニュー に表示されます。

My Application

アプリケーションの検証

自身のアプリケーションをローカルで実行したい場合は c8y serverを実行してください。以下のオプションも利用できます。

  • -u https://tenant.cumulocity.com apiコールをプロキシする場所をパラメータとしてインスタンスを使用する
  • -t examples or -t targets/examples.json 特定のターゲットファイルを使用する。 例えば、標準アプリケーションの1つの中でプラグインをテストしたい場合、ターゲットファイルを以下のようにする。

例:

{
  "name": "Examples",
  "comment": "Release with additional example plugins",
  "applications": [
    {
      "contextPath": "administration",
      "addImports": [
        "myapplication/weatherAdmin"
      ]
    },
    {
      "contextPath": "devicemanagement",
      "addImports": [
        "myapplication/deviceEventsRealTime",
        "myapplication/deviceContact"
      ]
    },
    {
      "contextPath": "cockpit",
      "addImports": [
        "myapplication/weather",
        "myapplication/iconmap"
      ]
    }
  ]
}

コンソール出力例:

$ c8y server -u https://tenant.cumulocity.com -t targets/examples.json
Cumulocity UI development server running in port 9000.
Proxying api requests to https://tenant.cumulocity.com
140 modules loaded.
5 application manifest loaded.
http://localhost:9000/apps/myapplication/ cumulocity.json
http://localhost:9000/apps/fieldbus4/  Packaged App
http://localhost:9000/apps/administration/  Packaged App
http://localhost:9000/apps/cockpit/  Packaged App
http://localhost:9000/apps/devicemanagement/  Packaged App

これで、URL "http://localhost:9000/apps/myapplication/"を自身のブラウザで開くことによりアプリケーションを検証することができます。アプリケーションへアクセスすると以下を見ることができるはずです:

My Application

あとは、ナビゲータ内に新規のメニューアイテムを追加するプラグインが必要です。

プラグインマニフェストの設定

自身のアプリケーション内にあるプラグインフォルダ内には各プラグインがサブフォルダに分けられ保存されています。プラグインをアプリケーションに追加するには以下の手順を踏む必要があります:

  • プロジェクト内に"plugins"フォルダを作成
  • "plugins"フォルダ内に"myplugin"フォルダを作成
  • "myplugin"フォルダ内にアプリケーションマニフェストとして"cumulocity.json"ファイルを作成
  • "myplugin"フォルダ内に"views"フォルダを作成
  • "views"フォルダ内にプラグインのビューとして"hello.html"ファイルを作成

上記の手順を踏むと以下のフォルダ構造となるはずです:

<<root folder>>
├── node_modules
├── plugins
|                ├──views
|                |     └── hello.html
|                └── cumulocity.json
├── cumulocity.json
└── package.json

プラグインマニフェストには名称、説明文、必要なファイル、主要アプリに追加する必要のあるangularモジュールなど、プラグイン情報が記載されています。例えば、"cumulocity.json"ファイルに以下のスクリプトを追加します:

{
    "name": "Hello world plugin testing",
    "description": "Simple hello world plugin."
}

マニフェストの他のプロパティの詳細については"Manifests"をご参照ください。

アプリケーションにプラグインを追加した今、アプリケーションマニフェストのインポート内にも追加する必要があります。インポートの呼称は/を挟んで二つの部位で成り立っています。前半の部分はプラグインが入っているアプリケーションのcontext pathとなり、後半の部分はプラグインのフォルダ名となります。今回の例ではアプリケーションマニフェスト内で特定されているように、"myapplication"というcontext pathを持つアプリケーション内にプラグインがあり、"myplugin"という名のプラグインフォルダ名なので、以下の通りとなります:

    {
        "availability": "PRIVATE",
        "contextPath": "myapplication",
        "key": "myapplication-appkey",
        "name": "myapplication",
        "resourcesUrl": "/",
        "type": "HOSTED",
        "imports": [
            "core/c8yBranding",
            "myapplication/myplugin"
        ]
    }

アプリケーションにプラグインフォルダを追加した後は機能性を導入することができます。

プラグイン初期化機能を導入

今回の例題の範囲は狭いですが、それでもモジュラーアプローチをお勧めします。そのために"hello.module.js"というモジュールファイルと"hello.config.js"という設定ファイルと"hello.controller.js"というコントローラを"myplugin"フォルダ内に作成します。

"hello.module.js"ファイル内でプラグインのモジュールを初期化します:

(function () {
  'use strict';

  angular.module('myapp.hello', []);
}());

自作ビューへとリダイレクトするメニューアイテムをナビゲーターへ新規に追加する場合"hello.config.js"を設定する必要があります。そこでCumulocity JavaScript APIで提供されている"c8yNavigatorProvider"と"c8yViewsProvider"を使用します。このサービスを自身の設定へ入れ込み、以下の関数を呼んでください:

(function () {
  'use strict';

  angular
    .module('myapp.hello')
    .config(configure);

  configure.$inject = [
    'c8yNavigatorProvider',
    'c8yViewsProvider'
  ];

  function configure(
    c8yNavigatorProvider,
    c8yViewsProvider
  ) {
    c8yNavigatorProvider.addNavigation({ // adds a menu item to the navigator with ...
      name: 'hello', // ... the name *"hello"*
      icon: 'cube', // ... the cube icon (icons are provided by the great Font Awesome library and you can use any of their [icon names](http://fontawesome.io/icons/) without the *fa-* prefix here
      priority: 100000, // ... a priority of 100000, which means that all menu items with a priority lower than 100000 appear before this menu item and all with a priority higher than 100000 appear after this menu item
      path: 'hello' // ... */hello* as path
    });

    c8yViewsProvider.when('/hello', { // when the path "/hello" is accessed ...
      templateUrl: ':::PLUGIN_PATH:::/views/hello.html', //  ... display our html file "hello.html" inside the "views" folder of our plugin (the plugin's folder is represented using the magic string ```:::PLUGIN_PATH:::```, which is replaced by the actual path during the build process)
      controller: 'HelloController', // ... use "HelloController" as controller
      controllerAs: 'vm'
    });
  }
}());

コントローラーを実装

次に、画面上にコントローラーを実装する必要があります。こちらの例ではコントローラーは"text"の変数をシンプルな固定テキスト"hello, world"として定義します:

(function () {
  'use strict';

  angular
    .module('myapp.hello')
    .controller('HelloController', HelloController);

  function HelloController() {
    var vm = this;

    vm.text = 'hello, world';
  }
}());

モジュール、設定、コントローラーを追加した今、"myapp.hello"としてモジュールを特定し、各javaスクリプトファイルをプラグインマニフェストへ追加する必要があります:

{
    "name": "Hello world plugin testing",
    "description": "Simple hello world plugin.",
    "ngModules": [
    "myapp.hello"
    ],
    "js": [
    "hello.module.js",
    "hello.config.js",
    "hello.controller.js"
    ]
}

ビューテンプレート

"text"の変数を定義した後はビューテンプレートへアクセスが可能となります。テキストを表示したい場合は以下を自身のhello.htmlファイルに追加してください:

<div>{{vm.text}}</div>

アプリケーションの検証 Test your application

アプリケーションを検証したい場合は、c8y serverコマンドを自身テナントをパラメータに入れた完全なURLと一緒に使用してください。

自身のアプリケーションとプラグインの構築と展開

c8y --helpを走らせれば利用可能なコマンドの一覧を見ることができます。 最終的にはThings Cloud のアドミニストレーションに手動で追加可能なzipファイルとなるアプリケーションを構築するか、または自身のテナントは直接アプリケーションを展開することができます。

構築:アプリ

指定フォルダ内にアプリケーションを構築する。(デフォルトは./build) outputFolder内には[appContextPath]という名のディレクトリと[appContextPath].zipというzipファイルがあります。このzipファイルはアドミニストレーションアプリケーション上へアップロードができます。 appContextPathを削除した場合、contextPathはコマンドが実行されたパスの"cumulocity.json"から読み取られます。

$ c8y build:app [appContextPath] [outputFolder]

構築:プラグイン

指定フォルダ内にプラグインを構築する。(デフォルトは./build). outputFolder内には[pluginName] という名のディレクトリと[pluginName].zipというzipファイルがあります。このzipファイルはアドミニストレーションインターフェース上へアップロードができ、どのアプリケーションへも追加が可能です。

$ c8y build:plugin <pluginName> [outputFolder]

展開:アプリ

プラグインを構築しアプリケーションを組立て、定義されたテナントへアップロードします。もしアプリがリモートインスタンス内に存在しない場合でも自動的に作成されます。appContextPathを削除した場合contextPathはコマンドが実行されたパスの"cumulocity.json"から読み取られます。 

$ c8y deploy:app [appContextPath]

プラグイン構築プロセスの手順は次の通りです:

  1. $injectを使ってangular関数に注釈を付ける。 (ng-annotateの使用方法)
  2. :::PLUGIN_PATH:::を適切なストリングに差替える。
  3. $templateCacheを使って全てのhtmlファイルが含まれるよう変換する。
  4. マニフェスト内の全てのjsファイルを連結させ最小化する。(UglifyJS 2の使用方法)
  5. 全てのlessファイルをコンパイルする。
  6. lessファイルのcssとresultを連結させ、最小化する。
  7. マニフェスト内の 'copy' に定義された全てのファイルをコピーする。
  8. プラグイン内のローカルズフォルダ内で得られそうなローカル化ファイルを全てコピーする。
  9. プラグインマニフェストをコピーする。
  10. 上記全てを含んだzipファイルを作成する。

アプリ構築プロセスの手順は次の通りです:

  1. インポートリストで定義された各プラグインのbuiltバージョンをコピーする。
  2. 各プラグインで得られる全てのローカル化ファイルを集め、利用可能言語ごとに一つの.jsonと.poファイルとして組み立てる。
  3. index.htmlを生成する。
  4. アプリケーションマニフェストをコピーする。
  5. 上記全てを含んだzipファイルを作成する。

コアアプリケーション内に独自のプラグインを展開する 

ターゲットを特定することでコアアプリケーションへプラグインを追加または差し替えすることができます。このファイルは名前やパスによる限定はありません。

{
    "name": "Examples",
    "comment": "Release with additional example plugins",
    "applications": [
        {
            "contextPath": "administration",
            "addImports": [ "myapplication/myplugin" ]
        }
    ]
}

上記の例では自身で開発したプラグインをコアアプリケーションの一つ(ここではアドミニストレーションアプリケーション)へ追加する方法が記されています。プラグインを特定するとき、必ずプラグインが含まれるアプリケーションのcontextPathを記載してください。この例では"myplugin" というプラグインは"myapplication"というcontextPathのアプリケーションのプラグインフォルダ内に入っています。

マネージメントテナント上に展開しない場合は以下のフラグメントを自身の.jsonファイルへ追加する必要があります:

    "allApplications": {
        "availability": "PRIVATE"
    }

ターゲットファイルを展開する場合は、c8y deploy:target[targetFile]を実行する必要があります。ただし以下のフォルダ構造であると想定します:

<<root folder>>
├── targets
|        └── target.json
├── plugins
|        └── ...
├── cumulocity.json
└── package.json

下記のコマンドを実行する必要があります:


c8y deploy:target targets/target.json