ウィジェットの依存関係の作成

  • リリースバージョン: Australia
  • 更新日 2026年03月12日
  • 所要時間：2分

    • サービスポータルでは、JavaScript および CSS ファイルをウィジェットにリンクして、ウィジェットとサードパーティライブラリ、外部スタイルシート、および角度モジュールの間の依存関係を作成できます。

    始める前に

    必要なロール：sp_admin または admin

    このタスクについて

    依存関係は、必要に応じてサーバーから非同期にロードされます。

    ウィジェットには、必要な数の依存関係を含めることができます。ただし、追加すればするほど、ウィジェットがページに表示するためにダウンロードする必要があるコンテンツが増えます。ロード時間を短くするため、依存関係はできる限り少なくしてください。

    手順

    1. 依存関係パッケージを作成します。

      依存関係パッケージは、ウィジェットに接続できる JavaScript ファイルと CSS ファイルのコレクションです。

      1. 移動先 サービスポータル > 依存関係.
      2. 依存関係レコードで、次のフィールドを定義します。
        フィールド 説明
        名前 依存関係の名前。(ドロップダウンリストから依存関係を選択するのに便利です)。
        アプリケーション 依存関係レコードのアプリケーションスコープ。
        ページロード時にインクルード サービスポータルの最初のページロード時に依存関係をページにロードするか、リンクされたウィジェットがページにロードされた場合にのみ依存関係をロードする場合はオフのままにします。
        Angular モジュール名 オプション。リンクされた JavaScript が Angular モジュールの場合に値を定義します。サービスポータル Angular アプリケーションに挿入できるように、ロードされる Angular モジュールの名前を指定します。
    2. 依存関係パッケージにファイルを追加します。

      依存関係パッケージの情報を保存したら、関連リストを使用して JS および CSS インクルードファイルを追加します。各関連リストについて、次の情報を含めます。

      フィールド 説明
      表示名 スクリプトインクルードの名前。
      ソース JS インクルードを追加するか CSS インクルードを追加するかに応じて、リストから次のいずれかのオプションを選択します。
      • URL
      • UI スクリプト (JS インクルードの場合) またはスタイルシート (CSS インクルードの場合)

      JS インクルードの場合は、[UI スクリプト] フィールドを使用して、次にある UI スクリプトを参照します。 システム UI > UI スクリプト.

      CSS インクルードの場合は、[スタイルシート] フィールドを使用して sp_css テーブルのレコードを参照します。
    3. 依存関係パッケージをウィジェットに追加します。
      依存関係パッケージを作成してファイルを追加したら、依存関係とウィジェットの間に関係を作成します。
      1. 移動先 サービスポータル > ウィジェット をクリックし、依存関係を追加するウィジェットレコードを見つけます。
      2. [依存関係] 関連リストで、[ 編集] をクリックします。
      3. スラッシュバケットで作成した依存関係を見つけ、ダブルクリックして右側の [選択したアイテム] 列に追加します。
      4. ページを保存してウィジェットレコードに戻ります。