Aurelia-プラグイン

アプリの構築を開始すると、ほとんどの場合、追加のプラグインを使用することになります。この章では、Aureliaフレームワークでプラグインを使用する方法を学びます。

標準プラグイン

前の章では、Aureliaフレームワークでデフォルト設定を使用する方法を見ました。デフォルト設定を使用している場合、プラグインの標準セットが利用可能になります。

* defaultBindingLanguage（）-このプラグインは *view-model を view に接続する簡単な方法を提供します。すでに一方向のデータバインディング構文*（$ \ {someValue}）*を見ました。他のバインディング言語を使用できますが、デフォルトのバインディング言語を使用することをお勧めします。
* defaultResources（）-デフォルトのリソースは、 *if、repeat、compose などの基本的な構造を提供します。これらのコンストラクトを自分で構築することもできますが、Aureliaは非常に一般的に使用されるため、すでにこのライブラリ内で作成しています。
* Router（）*-ほとんどのアプリケーションは何らかのルーティングを使用します。したがって、*ルーター*は標準プラグインの一部です。ルーティングの詳細については、後続の章で確認できます。
* History（）-履歴プラグインは通常 *router と一緒に使用されます。
* eventAggregator（）*-このプラグインは、コンポーネント間通信に使用されます。アプリ内のメッセージまたはチャンネルの公開と購読を処理します。

公式プラグイン

これらのプラグインはデフォルト設定の一部ではありませんが、頻繁に使用されます。

* fetch（）*-フェッチプラグインはHTTPリクエストの処理に使用されます。必要に応じて、他のAJAXライブラリを使用できます。
* animatorCSS（）*-このプラグインは、CSSアニメーションを処理する方法を提供します。
* animator-velocity（）*-CSSアニメーションの代わりに、Velocityアニメーションライブラリを使用できます。これらのプラグインにより、Aureliaアプリ内でVelocityを使用できます。
* dialog（）*-ダイアログプラグインは、高度にカスタマイズ可能なモーダルウィンドウを提供します。
* i18n（）*-これは、内部化とローカリゼーションのためのプラグインです。
* ui-virtualization（）*-仮想化は、大規模なパフォーマンスの重いUIタスクを処理するための便利なライブラリです。
* validation（）*-データを検証する必要があるときにこのプラグインを使用します。

上記で説明したすべてのプラグインは、このチュートリアルの執筆時点でAurelia Core Teamによって公式に保守されています。将来的には、その他の便利なプラグインが追加される予定です。次の例は、プラグインを使用するようにアプリを構成する方法を示しています。

プラグインのインストール

たとえば、 animator-css および animator-velocity を使用する場合は、最初にインストールする必要があります。

C:\Users\username\Desktop\aureliaApp>jspm install aurelia-animator-css
C:\Users\username\Desktop\aureliaApp>jspm install aurelia-animator-velocity

前の章では、手動構成の使用方法を学習しました。プラグインを main.js ファイルに追加できます。

main.js

export function configure(aurelia) {
   aurelia.use
   .defaultBindingLanguage()
   .defaultResources()
   .developmentLogging()
   .router()
   .history()
   .eventAggregator()
   .plugin('aurelia-animatorCSS')
   .plugin('aurelia-animator-velocity')

   aurelia.start().then(() => aurelia.setRoot());
}

Aurelia-plugins

目次

Aurelia-プラグイン

標準プラグイン

公式プラグイン

プラグインのインストール

main.js