Clientディレクトリ
プロジェクトディレクトリ内のclientフォルダには、アプリケーションのフロントエンドのすべてのコンポーネントが含まれています。これには、ウェブページのHTMLファイル、CSSファイル、ウェブページのアクション可能な要素を有効にするJavaScriptファイル、およびその他の必要なファイルが含まれます。
Clientディレクトリファイル
デフォルトでは、clientフォルダは以下のファイルでセットアップされます:
index.html:
index.htmlファイルは、Webアプリケーションのホームページのデフォルトファイル名です。サンプルコード構造で作成されます。
main.css:
main.cssファイルには、Webアプリケーションのページのスタイリングが含まれています。空のファイルとして作成されます。
main.js:
main.jsファイルは、Webアプリケーションのホームページの機能を定義します。空のファイルとして作成されます。
client-package jsonファイル
client-package.jsonは、Clientリソースの設定ファイルです。デフォルトで以下のアプリケーション仕様が含まれています:
{
"name":"shipmentTracking",
"version":"0.0.2",
"homepage":"index.html",
"login_redirect":"home.html",
"404":"custom404.html"
}
- name: Webクライアントの名前です。名前を設定してアプリケーションをホストした後は、変更しないでください。ホスト後にWebアプリケーションの名前を変更すると、エラーが発生します。
- version: ホストされているWebアプリケーションのバージョンで、小数形式です。アプリケーションの更新ごとに、バージョン番号を増分方式で変更できます。バージョン番号を減らすことはできません。
- homepage: WebアプリケーションのホームページのURLです。index.htmlファイルの名前を変更した場合、このファイルの値もそれに応じて変更する必要があります。
これらの必須仕様に加えて、以下のプロパティも含めることができます:
- description: Webアプリケーションの説明です。バージョンアップグレード時に変更できます。
- login_redirect: Webアプリケーションへのログイン成功後にユーザーがリダイレクトされるページです。
- 404: アプリケーション用に作成できるカスタム404ページです。アプリケーションのユーザーが存在しないページにアクセスして404エラーが発生するたびに、このカスタムページにリダイレクトされます。
-
404キーを使用してカスタム404ページへのパスを指定する場合、そのファイルには任意の名前を付けることができます。client-package.jsonファイルで404キーを設定しない場合でも、ディレクトリに正確に404.htmlという名前のページを含めることができます。
-
Catalystはclientpackage.jsonファイル内の404キーを検索します。存在する場合、アプリケーションで404エラーが発生した際にCatalystはそのファイルをレンダリングします。アプリにカスタム404ページのパスが指定されていない場合、Catalystはクライアントディレクトリ内の_404.html_という名前のファイルを検索します。どちらも存在しない場合、ユーザーはCatalystが提供するデフォルトの404ページにリダイレクトされます。
Webアプリケーションのクライアントファイルをさらに追加し、必要に応じてclientフォルダ内にサブフォルダを作成できます。ただし、client-package.jsonファイルは、クライアントリソースのルートにのみ必ず配置する必要があり、サブフォルダ内には配置できません。
-
Webアプリケーションのホームページとclient-package.jsonファイルは、クライアントディレクトリに必ず存在する必要があります。CSSおよびJSファイルは、アプリケーションの機能に基づいてオプションです。必要ない場合は、main.cssとmain.jsファイルを削除できます。
-
Webアプリケーションをホストする際、client-package.jsonファイルに記載されている仕様が正確であり、上記のすべてのガイドラインに従っていることを確認する必要があります。Webアプリケーションのホスティングの詳細については、Web Client Hostingを参照してください。
-
プロジェクトでの作業中に、CLIを使用していつでもClientコンポーネントをセットアップできます。詳しくは、Clientの操作を参照してください。
最終更新日 2026-02-23 18:09:41 +0530 IST
Yes
No
Send your feedback to us
