위젯 의존성 생성

  • 릴리스 버전: Xanadu
  • 업데이트 날짜 2024년 08월 01일
  • 읽기1분

    • 서비스 포털에서 JavaScript 및 CSS 파일을 위젯에 연결하여 위젯과 타사 라이브러리, 외부 스타일 시트 및 Angular 모듈 간에 종속성을 만들 수 있습니다.

    시작하기 전에

    필요한 역할: 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. 페이지를 저장하여 위젯 기록으로 돌아갑니다.