1. Vue.js JSSサンプルアプリケーションの概要

JSS Vue.jsサンプルアプリのアプリケーションビルディングシステム

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

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

JSS Vue.jsアプリには、作業を簡素化するためのビルドシステムヘルパーが含まれています。

足場

jss scaffold コマンドを使って新しいJSS Vueコンポーネントをスキャフォールドできます。スキャフォールドはscripts/scaffold-component.jsによって定義され、ニーズに合わせて完全にカスタマイズ可能です。スキャフォールディングはVueコンポーネントと切り離されたコンポーネント定義ファイルを作成し、コンポーネントを動作させるための有用なフィードバックを提供します。

!注Vueのコンポーネントはシングルファイルコンポーネントでスキャフォールディングされます。シングルファイルコンポーネントを使いたくない場合は、スキャフォールディングスクリプトを必要に応じてカスタマイズできます。

動的構成生成

JSSアプリは、現在のLayout Serviceエンドポイント設定など、JSS構成の一部を読み取れる必要があります。これを実現するために、ビルドを実行する前に、scripts/generate-config.jsで定義されたスクリプトがsrc/temp/config.jsファイルを動的にアセンブルします。アプリケーションは、設定へのアクセスが必要なときにこのファイルをインポートできます。このスクリプトは、設定要件が異なる場合、完全にカスタマイズ可能または削除可能です。

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

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

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

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

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

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

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