{"_id":"@bluewardai/ui5-loading","_rev":"5-543d9942beda18d511d606a3a0f698cb","name":"@bluewardai/ui5-loading","dist-tags":{"latest":"1.0.5"},"versions":{"1.0.1":{"name":"@bluewardai/ui5-loading","version":"1.0.1","keywords":["ui5","sapui5","loading","busy-indicator"],"author":{"name":"rendez0829"},"license":"MIT","_id":"@bluewardai/ui5-loading@1.0.1","maintainers":[{"name":"rendez0829","email":"rendez0829@gmail.com"}],"ui5":{"dependencies":[]},"dist":{"shasum":"48faa5a06f5583ce697bdaffd4e89ae564bbf62d","tarball":"https://registry.npmjs.org/@bluewardai/ui5-loading/-/ui5-loading-1.0.1.tgz","fileCount":11,"integrity":"sha512-0WpSnUoTxaGzWFRCAhsoQS/JfQ9ZIES9P3Sw8NQ8HBrQNXa6j7YSlyPKCoHjhthFx28qS3e31Y0UkViFOpWkoA==","signatures":[{"sig":"MEUCIQC6cYsqQY1s1Ns/cE3+8Ws5zULtiVoL0UmSGJmI2bEEhQIgA2u8OxGRtpYAic+CFi6SUAWSaGsMQjNwstBLvS1sDfQ=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":29233},"gitHead":"9324d1f6a3cf5dd2d65d8510c173b9cc9c59dad9","scripts":{"build":"ui5 build --clean-dest","check":"node --check src/blueward/ui/loading/library.js && node --check src/blueward/ui/loading/Loading.js && node --check src/blueward/ui/loading/Style.js"},"_npmUser":{"name":"rendez0829","email":"rendez0829@gmail.com"},"copyright":"Copyright (c) 2026 rendez0829","_npmVersion":"10.9.8","description":"Reusable global and scoped loading overlay library for UI5 applications","directories":{},"_nodeVersion":"22.23.1","_hasShrinkwrap":false,"devDependencies":{"@ui5/cli":"^3.0.0"},"_npmOperationalInternal":{"tmp":"tmp/ui5-loading_1.0.1_1788234434438_0.47123838504858484","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@bluewardai/ui5-loading","version":"1.0.2","keywords":["ui5","sapui5","loading","busy-indicator"],"author":{"name":"rendez0829"},"license":"MIT","_id":"@bluewardai/ui5-loading@1.0.2","maintainers":[{"name":"rendez0829","email":"rendez0829@gmail.com"}],"ui5":{"dependencies":[]},"dist":{"shasum":"411b19511b530115bfc208f684c44aa3130b13ed","tarball":"https://registry.npmjs.org/@bluewardai/ui5-loading/-/ui5-loading-1.0.2.tgz","fileCount":11,"integrity":"sha512-1wWhoCTIrv2f2xu4He1pxWlU7gkjkvjHRWMUMhtPLj1q4p/63i2FSTBruIoSZihNhXjWqjPBZypJZoKSZRC1Eg==","signatures":[{"sig":"MEQCIB/TMZaafhuf8uPzqNwiLUM27NSFIBnYeSe7TkMeSVAsAiAbaeVFVJ03jt5vF4EiAl5YIGKBdjsUaW/kpM4hqyKB4g==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":24817},"gitHead":"9324d1f6a3cf5dd2d65d8510c173b9cc9c59dad9","scripts":{"build":"ui5 build --clean-dest","check":"node --check src/blueward/ui/loading/library.js && node --check src/blueward/ui/loading/Loading.js && node --check src/blueward/ui/loading/Style.js"},"_npmUser":{"name":"rendez0829","email":"rendez0829@gmail.com"},"copyright":"Copyright (c) 2026 rendez0829","_npmVersion":"10.9.8","description":"Reusable global and scoped loading overlay library for UI5 applications","directories":{},"_nodeVersion":"22.23.1","_hasShrinkwrap":false,"devDependencies":{"@ui5/cli":"^3.0.0"},"_npmOperationalInternal":{"tmp":"tmp/ui5-loading_1.0.2_1788234740554_0.061564679605835115","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@bluewardai/ui5-loading","version":"1.0.3","keywords":["ui5","sapui5","loading","busy-indicator"],"author":{"name":"rendez0829"},"license":"MIT","_id":"@bluewardai/ui5-loading@1.0.3","maintainers":[{"name":"rendez0829","email":"rendez0829@gmail.com"}],"ui5":{"dependencies":[]},"dist":{"shasum":"6e14877f357ab81a088be6c30104144dd36f6cdd","tarball":"https://registry.npmjs.org/@bluewardai/ui5-loading/-/ui5-loading-1.0.3.tgz","fileCount":11,"integrity":"sha512-FrN9Hfq3zQzm7v7l3sdhdBUR7HRsFvdm7B2iiesk9Bg0CeR0tvP8/ztwRy64CQRJdLBTHVp7s9qgIg6pHaYv0g==","signatures":[{"sig":"MEUCIGDs1SzhhZKn0q+DIjgJAE6YhWYEYgsFlbvECmKRTqqiAiEA2FRA2ktQOyida/DpuUbOWR22EFhcIUf3dsm6P4sKVpE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":24873},"gitHead":"9324d1f6a3cf5dd2d65d8510c173b9cc9c59dad9","scripts":{"build":"ui5 build --clean-dest","check":"node --check src/blueward/ui/loading/library.js && node --check src/blueward/ui/loading/Loading.js && node --check src/blueward/ui/loading/Style.js"},"_npmUser":{"name":"rendez0829","email":"rendez0829@gmail.com"},"copyright":"Copyright (c) 2026 rendez0829","_npmVersion":"10.9.8","description":"Reusable global and scoped loading overlay library for UI5 applications","directories":{},"_nodeVersion":"22.23.1","_hasShrinkwrap":false,"devDependencies":{"@ui5/cli":"^3.0.0"},"_npmOperationalInternal":{"tmp":"tmp/ui5-loading_1.0.3_1788235024098_0.4515648703021087","host":"s3://npm-registry-packages-npm-production"}},"1.0.4":{"name":"@bluewardai/ui5-loading","version":"1.0.4","keywords":["ui5","sapui5","loading","busy-indicator"],"author":{"name":"rendez0829"},"license":"MIT","_id":"@bluewardai/ui5-loading@1.0.4","maintainers":[{"name":"rendez0829","email":"rendez0829@gmail.com"}],"ui5":{"dependencies":[]},"dist":{"shasum":"ec1a61a512314989502c337286a1157a4b6a4f0d","tarball":"https://registry.npmjs.org/@bluewardai/ui5-loading/-/ui5-loading-1.0.4.tgz","fileCount":11,"integrity":"sha512-s3jt5QMNKM9c0Jrn6VvH2CKp441GGvb9LPXtJ/B+aOdYO6NbVEK1zRPxWetWwH5yXorJ7ejkNc7AVYZtN7Olww==","signatures":[{"sig":"MEYCIQD7WT1phyuM9WeRjc0FIq5h7e3zDJ90GoJOvkSs/4Uu2AIhAP/WsJIL1OWQlXWCvwY2EnRjIxpc/b3YntgXftKvx2Ch","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":26730},"gitHead":"9324d1f6a3cf5dd2d65d8510c173b9cc9c59dad9","scripts":{"build":"ui5 build --clean-dest","check":"node --check src/blueward/ui/loading/library.js && node --check src/blueward/ui/loading/Loading.js && node --check src/blueward/ui/loading/Style.js"},"_npmUser":{"name":"rendez0829","email":"rendez0829@gmail.com"},"copyright":"Copyright (c) 2026 rendez0829","_npmVersion":"10.9.8","description":"Reusable global and scoped loading overlay library for UI5 applications","directories":{},"_nodeVersion":"22.23.1","_hasShrinkwrap":false,"devDependencies":{"@ui5/cli":"^3.0.0"},"_npmOperationalInternal":{"tmp":"tmp/ui5-loading_1.0.4_1788235209092_0.7604806171077432","host":"s3://npm-registry-packages-npm-production"}},"1.0.5":{"name":"@bluewardai/ui5-loading","version":"1.0.5","description":"Reusable global and scoped loading overlay library for UI5 applications","author":{"name":"rendez0829"},"copyright":"Copyright (c) 2026 rendez0829","keywords":["ui5","sapui5","loading","busy-indicator"],"license":"MIT","scripts":{"build":"ui5 build --clean-dest","check":"node --check src/blueward/ui/loading/library.js && node --check src/blueward/ui/loading/Loading.js && node --check src/blueward/ui/loading/Style.js"},"devDependencies":{"@ui5/cli":"^3.0.0"},"ui5":{"dependencies":[]},"_id":"@bluewardai/ui5-loading@1.0.5","gitHead":"9324d1f6a3cf5dd2d65d8510c173b9cc9c59dad9","_nodeVersion":"22.23.1","_npmVersion":"10.9.8","dist":{"integrity":"sha512-7gWWm4GheJags8wOuTdNf3D+Xg5ENpBaYwn1Z5TIwgki4AXYB1jvGFqIsr2+iSWybnM+KkRMnLz+ikyI4o2IDA==","shasum":"6b4d4752e16488a6cf3732d38875870823e45dc7","tarball":"https://registry.npmjs.org/@bluewardai/ui5-loading/-/ui5-loading-1.0.5.tgz","fileCount":11,"unpackedSize":37641,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQCmIdDIVE07wpsG3azZed7N7ZlSXgROGAUlS5v5j0dNKgIgU1akLwfDzc/HvURS2YTWocQpaUb8KljRq02uh/4ELTI="}]},"_npmUser":{"name":"rendez0829","email":"rendez0829@gmail.com"},"directories":{},"maintainers":[{"name":"rendez0829","email":"rendez0829@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/ui5-loading_1.0.5_1788239165600_0.3492707213113586"},"_hasShrinkwrap":false}},"time":{"created":"2026-09-01T03:47:14.245Z","modified":"2026-09-01T05:06:05.960Z","1.0.1":"2026-09-01T03:47:14.603Z","1.0.2":"2026-09-01T03:52:20.698Z","1.0.3":"2026-09-01T03:57:04.229Z","1.0.4":"2026-09-01T04:00:09.280Z","1.0.5":"2026-09-01T05:06:05.770Z"},"author":{"name":"rendez0829"},"license":"MIT","keywords":["ui5","sapui5","loading","busy-indicator"],"description":"Reusable global and scoped loading overlay library for UI5 applications","maintainers":[{"name":"rendez0829","email":"rendez0829@gmail.com"}],"readme":"# Blueward UI5 Loading\n\n`@bluewardai/ui5-loading`은 SAPUI5 애플리케이션에서 공통으로 사용할 수 있는 Loading overlay package입니다.\n\n이 문서는 Loading API 자체보다, 실제 소비 애플리케이션에서 npm package를 설치하고 로컬 approuter / UI5 build / BTP HTML5 Application Repository 환경에서 정상 동작시키기 위한 설정 방법과 이유를 설명합니다.\n\n## 패키지 정보\n\n```json\n{\n  \"name\": \"@bluewardai/ui5-loading\",\n  \"version\": \"1.0.5\",\n  \"ui5\": {\n    \"namespace\": \"blueward/ui/loading\"\n  }\n}\n```\n\nUI5 모듈 경로는 다음 namespace를 사용합니다.\n\n```text\nblueward.ui.loading\nblueward/ui/loading\n```\n\n## 1. 설치\n\n소비 애플리케이션의 root에서 설치합니다.\n\n```bash\nnpm install @bluewardai/ui5-loading\n```\n\n소비 애플리케이션의 `package.json`에는 `dependencies`와 `ui5.dependencies`를 함께 설정해야 합니다.\n\n```json\n{\n  \"dependencies\": {\n    \"@bluewardai/ui5-loading\": \"^1.0.5\"\n  },\n  \"ui5\": {\n    \"dependencies\": [\n      \"@bluewardai/ui5-loading\"\n    ]\n  }\n}\n```\n\n### 왜 `ui5.dependencies`가 필요한가?\n\n`dependencies`는 npm이 패키지를 `node_modules`에 설치하기 위한 설정입니다. 하지만 UI5 Tooling은 npm dependency 전체를 자동으로 UI5 library로 인식하지 않습니다.\n\n`ui5.dependencies`에 패키지를 등록해야 UI5 Tooling이 해당 패키지의 `ui5.yaml`을 읽고, `blueward.ui.loading`을 UI5 library project로 등록합니다. 이 설정이 빠지면 빌드나 로컬 서버에서 다음 경로를 찾지 못할 수 있습니다.\n\n```text\nresources/blueward/ui/loading/...\n```\n\n설정 후 아래 명령어로 인식 여부를 확인할 수 있습니다.\n\n```bash\nnpx ui5 tree --flat\n```\n\n정상이라면 출력에 다음 항목이 포함됩니다.\n\n```text\nblueward.ui.loading blueward/ui/loading\n```\n\n## 2. UI5 CLI 버전\n\n이 패키지는 `ui5.yaml`에서 `specVersion: \"3.1\"`을 사용합니다. 따라서 소비 애플리케이션은 UI5 CLI 3.x 이상을 사용해야 합니다.\n\n```bash\nnpm install --save-dev @ui5/cli@^3\n```\n\nUI5 CLI 2.x를 사용하면 빌드 또는 `ui5 tree` 실행 시 아래와 같은 오류가 발생할 수 있습니다.\n\n```text\nUnsupported \"specVersion\"\n```\n\n이 오류는 패키지 문제가 아니라, 소비 애플리케이션의 UI5 Tooling 버전이 패키지의 `ui5.yaml` specVersion을 해석하지 못해서 발생합니다.\n\n## 3. 모듈 import\n\nController나 Component에서 일반 UI5 module처럼 import합니다.\n\n```js\nsap.ui.define([\n  \"sap/ui/core/mvc/Controller\",\n  \"blueward/ui/loading/Loading\"\n], function (Controller, Loading) {\n  \"use strict\";\n\n  return Controller.extend(\"sample.controller.Main\", {\n    onLoad: function () {\n      return Loading.run(this._loadData(), {\n        target: this.getView(),\n        text: \"Loading...\"\n      });\n    }\n  });\n});\n```\n\n`Loading` module은 내부에서 `blueward/ui/loading/library`를 로드합니다. 여러 화면에서 loading을 공통으로 사용한다면, 앱 시작 시점에 `blueward/ui/loading/library`를 한 번 import해두는 방식도 사용할 수 있습니다.\n\n## 4. 기본 사용법\n\n전체 화면 loading:\n\n```js\nvar handle = Loading.show({\n  text: \"Loading...\"\n});\n\nhandle.close();\n```\n\n특정 UI5 control 위에 loading:\n\n```js\nvar handle = Loading.show(this.getView(), {\n  text: \"Loading data...\"\n});\n\nhandle.close();\n```\n\nPromise 실행 중 자동 loading:\n\n```js\nreturn Loading.run(this._loadData(), {\n  target: this.getView(),\n  text: \"Loading data...\"\n});\n```\n\n## 5. CSS / Style 설정\n\nLoading overlay는 패키지 내부의 theme stylesheet를 사용합니다.\n\n```text\nblueward/ui/loading/themes/base/library.css\n```\n\n`Loading.js`가 로드되었더라도 stylesheet가 정상적으로 삽입되지 않으면 overlay가 기대한 형태로 보이지 않을 수 있습니다.\n\n이 문제를 막기 위해 화면 Controller마다 `Style`을 넣는 방식은 권장하지 않습니다. CSS는 화면 로직이 아니라 애플리케이션 초기화 책임에 가깝기 때문입니다.\n\n소비 애플리케이션에서는 `Component.js`처럼 앱 시작 시 한 번만 로드되는 module에 `blueward/ui/loading/library`를 등록하는 방식을 권장합니다.\n\n`blueward/ui/loading/library`는 내부에서 `blueward/ui/loading/Style`을 로드하므로, 소비 앱은 Style module을 직접 알 필요가 없습니다.\n\n```js\nsap.ui.define([\n  \"sap/ui/core/UIComponent\",\n  \"blueward/ui/loading/library\"\n], function (UIComponent) {\n  \"use strict\";\n\n  return UIComponent.extend(\"sample.Component\", {\n    metadata: {\n      manifest: \"json\"\n    }\n  });\n});\n```\n\n`library` module은 UI5 library를 초기화하고, 패키지 CSS가 한 번만 로드되도록 보장합니다.\n\n프로젝트에 별도 bootstrap module이 있다면 `Component.js` 대신 그곳에 한 번만 import해도 됩니다. 중요한 기준은 “화면별 Controller에 반복 추가하지 않고, 앱 시작 지점에서 library를 한 번만 로드한다”는 것입니다.\n\n### `manifest.json`의 `sap.ui5.dependencies.libs`에 넣지 않는 이유\n\nCSS 또는 preload를 강제로 로드하려고 `manifest.json`에 아래처럼 추가하는 방식은 권장하지 않습니다.\n\n```json\n{\n  \"sap.ui5\": {\n    \"dependencies\": {\n      \"libs\": {\n        \"blueward.ui.loading\": {}\n      }\n    }\n  }\n}\n```\n\n이 방식은 일부 local approuter / proxy 환경에서 UI5가 custom library preload를 CDN, ABAP app index, 또는 잘못된 runtime 위치에서 찾게 만들 수 있습니다.\n\nBlueward npm package는 SAPUI5 CDN이나 ABAP app index에 존재하는 표준 library가 아니므로, library 초기화는 `blueward/ui/loading/library` import로 처리하고, 파일 제공은 아래의 resource root / approuter / build 설정으로 처리하는 것이 안전합니다.\n\n## 6. Resource root 설정\n\nHTML bootstrap에서 `blueward.ui.loading` namespace가 앱 내부의 `resources/blueward/ui/loading`을 바라보도록 설정합니다.\n\n애플리케이션 root의 `index.html` 기준:\n\n```html\n<script\n  id=\"sap-ui-bootstrap\"\n  data-sap-ui-resourceroots='{\n    \"sample\": \"./\",\n    \"blueward.ui.loading\": \"./resources/blueward/ui/loading\"\n  }'>\n</script>\n```\n\n`test/flpSandbox.html`처럼 한 단계 하위 경로에서 실행되는 파일은 상대 경로가 달라지므로 다음처럼 설정합니다.\n\n```html\n<script\n  id=\"sap-ui-bootstrap\"\n  data-sap-ui-resourceroots='{\n    \"sample\": \"../\",\n    \"blueward.ui.loading\": \"../resources/blueward/ui/loading\"\n  }'>\n</script>\n```\n\n### 왜 app root 상대 경로를 사용하는가?\n\napprouter에서 애플리케이션이 `/myapp/index.html`로 서비스되는 경우, 브라우저의 실제 요청은 보통 아래처럼 나갑니다.\n\n```text\n/myapp/resources/blueward/ui/loading/Loading.js\n```\n\n따라서 bootstrap에서는 현재 HTML5 앱 root 기준의 상대 경로를 사용하는 편이 로컬 approuter와 BTP HTML5 Repository 양쪽에서 가장 예측 가능합니다.\n\n## 7. 로컬 approuter 설정\n\n로컬에서 `@sap/approuter`를 사용하고 `xs-app-local.json`이 애플리케이션 `webapp`만 `localDir`로 바라보는 경우, `node_modules`에 설치된 Blueward package 파일은 자동으로 서비스되지 않습니다.\n\n예를 들어 아래 catch-all route만 있으면:\n\n```json\n{\n  \"source\": \"^/myapp/(.*)$\",\n  \"target\": \"$1\",\n  \"localDir\": \"../app/webapp\"\n}\n```\n\n다음 요청은 `webapp/resources/...`에서 파일을 찾게 됩니다.\n\n```text\n/myapp/resources/blueward/ui/loading/Loading.js\n```\n\n하지만 로컬 개발 시 Blueward package의 원본 파일은 보통 아래에 있습니다.\n\n```text\n../app/node_modules/@bluewardai/ui5-loading/src/blueward/ui/loading\n```\n\n따라서 `xs-app-local.json`에서 generic app route보다 먼저 Blueward 전용 route를 추가합니다.\n\n```json\n{\n  \"source\": \"^/myapp/resources/blueward/ui/loading/(.*)$\",\n  \"target\": \"$1\",\n  \"localDir\": \"../app/node_modules/@bluewardai/ui5-loading/src/blueward/ui/loading\",\n  \"cacheControl\": \"no-cache, no-store, must-revalidate\"\n},\n{\n  \"source\": \"^/myapp/(.*)$\",\n  \"target\": \"$1\",\n  \"localDir\": \"../app/webapp\",\n  \"cacheControl\": \"no-cache, no-store, must-revalidate\"\n}\n```\n\n중요한 점은 Blueward route가 반드시 catch-all route보다 앞에 있어야 한다는 것입니다. 뒤에 있으면 먼저 catch-all route가 요청을 잡아버려 404가 발생할 수 있습니다.\n\nroute를 수정한 뒤에는 approuter process를 완전히 종료하고 다시 실행해야 합니다. 실행 중인 approuter는 기존 route table을 메모리에 가지고 있으므로 파일만 수정해도 바로 반영되지 않습니다.\n\n## 8. UI5 build 설정\n\n배포용 빌드에서는 `node_modules`의 package source를 runtime에서 직접 읽지 않습니다. 빌드 결과물인 `dist` 또는 배포 ZIP 안에 Blueward resource가 포함되어 있어야 합니다.\n\n소비 애플리케이션의 `ui5.yaml`에 dependency include를 추가합니다.\n\n```yaml\nbuilder:\n  settings:\n    includeDependency:\n      - blueward.ui.loading\n```\n\n빌드 후 아래 파일이 존재해야 합니다.\n\n```text\ndist/resources/blueward/ui/loading/library.js\ndist/resources/blueward/ui/loading/Loading.js\ndist/resources/blueward/ui/loading/themes/base/library.css\n```\n\n## 9. `ui5 build preload` / CF build 설정\n\n일부 프로젝트는 CF 배포용으로 별도 `ui5-deploy.yaml`과 `ui5 build preload`를 사용합니다. 이때 config 파일 구조에 따라 `builder.settings`를 넣으면 UI5 Tooling이 허용하지 않는 경우가 있습니다.\n\n그 경우 package dependency를 CLI option으로 명시합니다.\n\n```json\n{\n  \"scripts\": {\n    \"build:cf\": \"ui5 build preload --clean-dest --config ui5-deploy.yaml --include-task=generateCachebusterInfo --include-dependency blueward.ui.loading\"\n  }\n}\n```\n\nBlueward package를 여러 개 사용한다면 `--include-dependency`를 package별로 반복합니다.\n\n```json\n{\n  \"scripts\": {\n    \"build:cf\": \"ui5 build preload --clean-dest --config ui5-deploy.yaml --include-task=generateCachebusterInfo --include-dependency blueward.ui.controls --include-dependency blueward.ui.loading\"\n  }\n}\n```\n\n## 10. `ui5-task-zipper` 사용 시\n\n`ui5-task-zipper`로 `<app-name>.zip`을 생성하는 프로젝트는 `includeDependencies: true`를 설정해야 합니다.\n\n```yaml\nbuilder:\n  customTasks:\n    - name: ui5-task-zipper\n      afterTask: generateCachebusterInfo\n      configuration:\n        archiveName: myapp\n        includeDependencies: true\n        additionalFiles:\n          - xs-app.json\n```\n\n이 설정이 없으면 `dist/resources/blueward/...`에는 파일이 존재하더라도, 최종 ZIP 안에는 dependency resource가 빠질 수 있습니다. 그러면 HTML5 repo mock 또는 BTP HTML5 Application Repository runtime에서 아래 요청이 404가 됩니다.\n\n```text\n/myapp/resources/blueward/ui/loading/Loading.js\n```\n\n## 11. BTP HTML5 Application Repository 배포 확인\n\nBTP HTML5 Application Repository에 배포할 때는 최종 artifact 안에 다음 경로가 포함되어야 합니다.\n\n```text\nresources/blueward/ui/loading/\n```\n\n배포 후 브라우저 Network 탭에서 다음 파일들이 200으로 내려오는지 확인합니다.\n\n```text\n/myapp/resources/blueward/ui/loading/library.js\n/myapp/resources/blueward/ui/loading/Loading.js\n/myapp/resources/blueward/ui/loading/themes/base/library.css\n```\n\n## 12. reuse library resolver / app index 사용 프로젝트 주의\n\n일부 UI5 프로젝트는 `manifest.json`의 `sap.ui5.dependencies.libs`를 읽어서 `/sap/bc/ui2/app_index/ui5_app_info` 같은 ABAP app index API로 reuse library 위치를 찾는 custom script를 사용합니다.\n\nBlueward npm package는 ABAP app index에 등록된 reuse library가 아니므로, 이런 resolver가 있다면 `blueward.*` namespace는 조회 대상에서 제외해야 합니다.\n\n권장 방식은 다음과 같습니다.\n\n- npm package는 `package.json`의 `dependencies`와 `ui5.dependencies`로 관리\n- runtime 경로는 `resourceroots`와 approuter route로 관리\n- build artifact 포함은 `includeDependency` 또는 `--include-dependency`로 관리\n- CSS는 `blueward/ui/loading/library` 1회 import로 관리\n\n## 13. 문제 해결\n\n### `Loading.js`, `library.js`, `library-preload.js`가 404인 경우\n\nNetwork 탭에서 실제 Request URL을 먼저 확인합니다.\n\n- `/myapp/resources/blueward/...`가 404라면 local approuter route 또는 배포 artifact 누락 문제일 가능성이 큽니다.\n- `https://ui5.sap.com/resources/blueward/...`로 요청된다면 custom library를 SAPUI5 CDN에서 찾고 있는 것입니다. `resourceroots` 또는 proxy 설정을 확인해야 합니다.\n- `dist/resources/blueward/...`에는 있는데 ZIP에는 없다면 `ui5-task-zipper`의 `includeDependencies: true`를 확인합니다.\n\n### Loading overlay 스타일이 이상한 경우\n\nLoading JavaScript는 로드되었지만 CSS가 로드되지 않은 상태일 수 있습니다.\n\n확인할 것:\n\n- `blueward/ui/loading/library`를 앱 초기 module에서 한 번 import했는지\n- Network 탭에서 아래 CSS가 200으로 내려오는지\n\n```text\n/myapp/resources/blueward/ui/loading/themes/base/library.css\n```\n\n### `net::ERR_BLOCKED_BY_ORB`가 발생하는 경우\n\n브라우저가 JavaScript를 기대했는데 실제 응답이 HTML 404 페이지 또는 잘못된 MIME type인 경우 발생할 수 있습니다.\n\n대부분 원인은 다음 중 하나입니다.\n\n- approuter catch-all route가 Blueward 요청을 먼저 잡음\n- Blueward resource route가 없음\n- resource root가 잘못됨\n- 배포 ZIP에 dependency resource가 빠짐\n- SAPUI5 CDN으로 custom library를 요청함\n\n### 설정을 바꿨는데 계속 404인 경우\n\n로컬 approuter process가 이전 route table을 계속 들고 있을 수 있습니다. `npm run start`로 실행 중인 approuter를 완전히 종료한 뒤 다시 시작합니다.\n\n## License\n\nMIT. See [LICENSE](./LICENSE) and [NOTICE](./NOTICE).\n","readmeFilename":"README.md"}