VMRPを使用してアプリにライブラリをインポートする方法

Vegaモジュールリゾルバーのプリセット（VMRP）を使用して、アプリにライブラリをインポートできます。VMRPは、サードパーティのライブラリを同等のVegaプラットフォームに移植したライブラリに置き換えます。iOSまたはAndroidで既に実行されているアプリをVegaで使用するには、VMRPを使用します。 VMRPが必要なのは、Vegaがデフォルトで分割バンドルを実装しており、JavaScriptバンドルが標準のnpmエイリアスとオーバーライドをサポートしていないためです。VMRPは、この分割バンドルアーキテクチャで適切なモジュール解像度を確保するためのエイリアスソリューションを提供します。このプリセットがない場合は、既存のライブラリと同等のVega移植版をインポートする必要があります。たとえば、アプリがreact-native-gesture-handlerを使用していて、これをVegaで使用する場合は、Vegaバージョンのライブラリのコードに次の行を追加する必要があります。

import { ... } from '@amazon-devices/react-native-gesture-handler'

VMRPを使用することで、インポート名は’react-native-gesture-handler’のまま使用でき、バンドル時にライブラリがスワップアウトされます。

プリセットについて

VMRPは、それを使用するパッケージのnode_modulesを順に調べて、Vegaに移植されたパッケージと、アプリが要求する同等のライブラリとの関係を構築します。バージョンが同等であれば、マッピングが確立され、その関係が出力に記録されます。バージョンが等しくない場合、またはその他の理由でモジュールリゾルバーが失敗した場合は、エラー出力がログに記録されます。

インストール

VMRPは個別のNPMパッケージとして配布されます。インストールするには、次のコマンドを実行します。

npm install --save-dev "@amazon-devices/kepler-module-resolver-preset"

さらに、このコマンドにはbabel-plugin-module-resolverを含める必要があります。

npm install --save-dev "babel-plugin-module-resolver"

さらに、オリジナルのサードパーティライブラリと、それと同等のVega移植ライブラリの両方をインストールする必要があります。たとえば、ジェスチャーハンドラーをVegaの同等のライブラリに置き換える場合は、以下の例に示すように、package.jsonの依存関係に両方のパッケージを正確なバージョンでインストールする必要があります。

"dependencies": {
  ...
  "@amazon-devices/react-native-gesture-handler": "2.0.0+2.13.0",
  "react-native-gesture-handler": "2.13.0",
  ...
}

セットアップ

インストール後、コードをビルドするときに使用する新しいプリセットがあることをbabelに通知する必要があります。これは、Babelの構成ファイルを変更することによって行われます。通常、これはpackage.jsonファイルと同じフォルダにある.babelrcまたはbabel.config.jsのいずれかです。

module.exports = {
    presets: [
        'module:metro-react-native-babel-preset',
        'module:@amazon-devices/kepler-module-resolver-preset', // VegaModuleResolverPresetの使用を有効にします。
        ...
    ],
    ...
  };

その後、パッケージをクリーンアップして再ビルドする必要があります。モジュールの交換に成功すると、ライブラリがスワップされたことを示す出力がログに表示されます。次に例を示します。

[stdout] transform: [kepler-module-resolver] Mapped <LibraryNameHere> to <VegaPortedLibraryNameHere>@<Version>

​プリセットについて

​インストール

​セットアップ

プリセットについて

インストール

セットアップ