본문 바로가기

[UI5] Bootstrap, Module 설명

초록활명수 2025. 12. 9.
반응형

 

Bootstrap

- UI5 엔진을 로딩하고 설정을 읽고 앱을 시작하는 기본 스크립트

- BAS를 통해 자동으로 생성된 Bootstrap 소스는 삭제처리한다. 

Bootstrap

 

Bootstrap 설명 

 <script
        id="sap-ui-bootstrap"
        src="resources/sap-ui-core.js"
        data-sap-ui-theme="sap_horizon"S
        data-sap-ui-resource-roots='{
            "com.training.student09": "./"
        }'
        data-sap-ui-on-init="module:sap/ui/core/ComponentSupport"
        data-sap-ui-compat-version="edge"
        data-sap-ui-async="true"
        data-sap-ui-frame-options="trusted"
    ></script>

 

- ID : 

- SRC : 코어가 어디에 있는지에 대한 정보 

- data-sap-ui-theme : 테마 어떤거 사용할지 (기본 Fiorid 앱, 고객사의 특정 테마 등 - 위에 적힌 소스는 SAP 기본 소스)

- data-sap-ui-libs : UI5에서 어떤 라이브러리를 미리 로드할 것인지 지정

sap.m 모바일용 UI 컨트롤 (버튼, 입력창 등 대부분의 기본 컨트롤)
sap.ui.core UI5 코어 기능 (기본적으로 항상 필요)
sap.ui.layout 레이아웃 컨트롤들 (Form, Grid 등)
sap.ui.table 테이블 컨트롤(Desktop 중심)
sap.f Flexible Column Layout / Fiori Elements
sap.ui.comp Smart Controls (SmartTable 등)
sap.viz 시각화(그래프/차트)

- data-sap-ui-compatVersion : 옛날에 쓰던 정보로 SAPUI5에서 “구버전 호환성 모드(Compatibility Version)”를 설정하는 속성

(일반적으로 edge 쓰면 됨)

 

 

 

 

Module

모듈은 재사용가능한 것을 뜻한다.

reuse.js

 

- reuse.js 생성 후 모듈 관련 로직 구현한다.

 

index.html

 

- index.html 에 작성했던 application 관련 로직 삭제

-  ./ = 현재 위치, 현재위치를 com.training.student09 라고 하겠다.

 

 

참고자료)

script 에 대한 설명

 

반응형

댓글