JSS Angularサンプルアプリのアプリケーションビルドシステム

Version:
日本語翻訳に関する免責事項

このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。

JSS Angularアプリには、アプリの操作を容易にするためのビルドシステムヘルパーが含まれています。

足場

新しいAngular Schematicはjss scaffold コマンドで足場を組むことができます。

JSS Angular Schematicsは、デフォルトのコンポーネントスキャフォールディングツールに基づくJSSコンポーネント回路図ng generate提供します。スクリプトjss scaffold MyComponentを実行すると、新しいAngular回路図が作成され、切断されたコンポーネント定義ファイルが作成され、コンポーネントを動作させるための有益なフィードバックを提供します。

スキャフォールディングコンポーネントの設定は、angular.jsonファイルのAngular Schematicsのスキャフォールディング設定を追加・更新することで設定できます。

以下の例は、CSSの代わりにSCSSをスタイリングに使う新しいコンポーネントを生成する方法を示しています:

"schematics": {     "@sitecore-jss/sitecore-jss-angular-schematics

": {       "styleext": "scss"     }   }

追加設定については、JSSのAngular Schematicスキーマ定義 または スキーマタイプを参照してください。

動的構成生成

JSSアプリは、Angular環境ファイルが提供するものよりも動的な設定システムが必要です。なぜなら、設定はscjssconfig.jsonファイルやpackage.json``configセクションで定義された構成とも統合されなければならないからです。

これを実現するために、ビルドを実行する前に、scripts/generate-config.jsで定義されたスクリプトがsrc/environments/environment*.tsファイルを動的にアセンブルします。 scripts/generate-config.jsスクリプトは設定要件が異なる場合に完全にカスタマイズ可能、または削除可能です。

動的コンポーネントファクトリーモジュール

ビルドが始まると、JSS Angularアプリは自動的にsrc/temp/componentFactory.jsファイル内のコンポーネントファクトリーを生成します。コンポーネントファクトリーはJSSコンポーネント名とそのAngularコンポーネント実装とのマッピングです。

src/temp/componentFactory.jsファイルはJSSコンポーネントを定義するための慣習で生成されます。これにより、新しいコンポーネントを手動で登録する手間を避けられます。アプリがローカルで動作すると、コンポーネントファクトリーが新しいコンポーネントを監視し、モジュールを更新します。この自動生成はscripts/generate-component-factory.jsで定義されており、完全にカスタマイズ可能です。

!注この慣例をJSSアプリケーションから削除するには:

  • src/temp/.gitignoreファイルでcomponentFactory.jsを削除してください。

  • 削除 /scripts/generate-component-factory.js。

  • /scripts/bootstrap.jsファイルで削除されたスクリプトへの参照を削除してください。

この記事を改善するための提案がある場合は、 お知らせください!