次世代プラットフォーム

フローの追加

ビジネス要件に従ってフローを作成できます。 各フローは、その依存関係を管理するための独自の package.json と、角度経路としてモデル化された画面またはページ・コンポーネントの集まりを備えた、単一スパ対応の角度アプリケーションです。 ページ・コンポーネントは、ルーティング・モジュールで経路を定義するために使用される経路レベルの角度コンポーネントです。

手順

シングル・スパを有効にして新しい角度アプリケーションを作成するには、以下の手順を実行します。
  1. <store-temp> ディレクトリーに移動して、以下のコマンドを実行します。
    yarn new-extension-feature --module-name=<module-name> --port=<port>
    このコマンドは、以下のオプションをサポートします。
    • --module-name -モジュールの名前です。
      注: < module-name> 属性値の各単語がハイフン (-) で区切られていることを確認してください。 例えば、モジュール名が custom move inventoryの場合、値を custom-move-inventoryと指定します。
    • --port -新規アプリケーションが実行されるポート番号。
    このコマンドは、以下のタスクを実行します。
    • <store-temp>/extensions/features フォルダーの下に、接頭部が isf の新しい角度アプリケーションを作成します。 すべてのソース・コードは、 <store-temp>/extensions/features/<module-name> フォルダー内にあります。
    • single-spa-angular をインストールします。
    • src プロジェクト・フォルダーに main.single-spa.ts を生成します。
    • src/app プロジェクト・フォルダー内に、 <module-name> を持つ遅延ロード・モジュールを生成します。
    • ルーティング・モジュールの src/app-routing.module.ts ファイルを以下の経路定義で更新します。
      • 適切な経路パス定義を持つ遅延ロード・モジュール。
      • 一致しない経路の場合は EmptyRouteComponent
    • アプリケーションの開始スクリプトとビルド・スクリプトを使用して、 package.json プロジェクト・ルートを更新します。 これらのスクリプトは、アプリケーションの開始およびビルドに使用されます。
    • 新規アプリケーションを <store-temp>/extensions/override-static-assets/root-config/custom/import-map.jsonに登録します。 import-map.json ファイルは、特定のアプリケーションをロードするために JavaScript モジュールを登録します。
    • ローカリゼーションおよび国際化対応をサポートするために、言語固有のバンドルを維持するために、 src/assets プロジェクト・フォルダー内に i18n フォルダーが生成されます。 空の en.json バンドル JSON ファイルが src/assets/<module-name>/i18n プロジェクト・フォルダー内に生成されます。 このコードは、適切な変換バンドル JSON ファイルをロードするように TranslateModule をセットアップするためにも更新されます。
  2. <store-temp>/extensions/features/<module-name>/src/app/features/<module-name>でフローの新規ビューまたは画面を作成します。

    各画面は、 <store-temp>/extensions/features/<module-name>/src/app/features<module-name>/<module-name>.routing.module.ts ファイルに定義されている、対応する経路を持つページ・コンポーネントです。

  3. routes.jsonで新規フローの一部として追加された新規ルートを更新します。 新しい経路は <store-temp>/extensions/override-static-assets/root-config/custom/routes.jsonにあります。

    アプリケーションで提供される経路は、 store-single-spa/extensions/override-static-assets/root-config/custom/routes.jsonに存在する feature-routes.json の一部として構成されます。 新しいルートの更新についての詳細は、 Updating import-maps and routes.json を参照のこと。

次のタスク

以下の作業を実行してください。