SAP UI5 + Yarn = не запускается

Информация: у NPM такая же проблема

Я хочу создать проект UI5, но UI5 нужно импортировать с помощью NPM или Yarn. Я загрузил пример из пошагового руководства, шаг 12: https://sapui5.hana.ondemand.com/... и установил Yarn. Файл package.json уже присутствует в демонстрации, и команда "yarn install" (а также "npm install") загрузила все в node_modules. Затем я изменил атрибут src в index.html следующим образом:

src="../node_modules/@openui5/sap.ui.core/src/sap-ui-core.js"

Но когда я запускаю index.html, он ничего не делает. Например, отображается эта ошибка:

Failed to load component for container container. Reason: Error: failed to load 'sap/m/library.js' from ../node_modules/@openui5/sap.ui.core/src/sap/m/library.js: script load error.

... папка "м" не существует...

Также library.js ищется в несуществующей папке: node_modules/@openui5/sap.ui.core/src/sap/ui/core/themes/sap_belize/library.css ... папка sap_belize отсутствует.

Когда я использую UI5-src по умолчанию, все работает:

src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"

Многие отмечают, что ui5-src должен выглядеть так:

src="resources/sap-ui-core.js"

... но такой папки не существует, поэтому она не может работать.

Что-то мне не хватает? Я ожидал, что это сработает немедленно, но я потратил на это 4 часа... Спасибо.

Изменить: все работает отлично, когда я загружаю весь UI5 с https://openui5.org/releases/... но NPM и Yarn имеют другую структуру папок, поэтому я добавил следующие data-sap-ui-resourceroots, и теперь кажется, что UI5 как-то работает, но тема все равно отсутствует...

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>SAPUI5 Walkthrough</title>
    <script
        id="sap-ui-bootstrap"
        src="../node_modules/@openui5/sap.ui.core/src/sap-ui-core.js"
        data-sap-ui-theme="sap_belize"
        data-sap-ui-resourceroots='{
            "sap.ui.demo.walkthrough": "./",
            "sap.m": "../node_modules/@openui5/sap.m/src/sap/m",
            "sap.base": "../node_modules/@openui5/sap.ui.core/src/sap/base",
            "sap.ui": "../node_modules/@openui5/sap.ui.core/src/sap/ui",
            "sap.ui.layout": "../node_modules/@openui5/sap.ui.layout/src/sap/ui/layout",
            "sap.ui.unified": "../node_modules/@openui5/sap.ui.unified/src/sap/ui/unified",
            "sap.m.themes": "../node_modules/@openui5/themelib_sap_belize/src/sap/m/themes"

        }'
            data-sap-ui-theme-roots='{
              "sap_belize": "../node_modules/@openui5/themelib_sap_belize/src/"
            }'
        data-sap-ui-oninit="module:sap/ui/core/ComponentSupport"
        data-sap-ui-compatVersion="edge"
        data-sap-ui-async="true">
    </script>
</head>
<body class="sapUiBody" id="content">
    <div data-sap-ui-component data-name="sap.ui.demo.walkthrough" data-id="container" data-settings='{"id" : "walkthrough"}'></div>
</body>
</html>

Моя текущая ошибка говорит о том, что требуется какой-то несуществующий файл:

Could not load theme parameters from: 
file:///C:/_my/sap.m.tutorial.walkthrough.12/node_modules/@openui5/themelib_sap_b>elize/src/sap/ui/core/themes/sap_belize/library-parameters.json
- NetworkError: Failed to execute 'send' on 'XMLHttpRequest':
Failed to load 
'file:///C:/_my/sap.m.tutorial.walkthrough.12/node_modules/@openui5/themelib_sap_belize/src/sap/ui/core/themes/sap_belize/library-parameters.json'.

2 ответа

Решение

На ваш вопрос уже дан ответ в документации UI5, см. Разработка приложений с использованием OpenUI5, раздел "Разработка приложений с использованием OpenUI5".

По сути, все образцы и руководства UI5 предполагают наличие промежуточного программного обеспечения с поддержкой UI5, которое * отображает все библиотеки UI5 в единую иерархию * отображает корень этой иерархии в корень приложения, используя виртуальный путь с именем resources/.

Ui5-набор инструментов, который является открытым исходным кодом, обеспечивает такое промежуточное программное обеспечение из коробки. Собственные серверы SAP, которые предлагают поддержку UI5 (например, NetWeaver ABAP, NetWeaver Java, ...), включают аналогичные промежуточные программы.

Если вы не хотите использовать такое промежуточное ПО, то либо требуется дополнительная конфигурация (как вы это делали с корнями ресурсов и тем), либо вам нужно скопировать все файлы вместе в структуру, подходящую для ваших нужд.

Однако рекомендуемый способ описан выше.

Возьмите официальный образец приложения. https://github.com/SAP/openui5-masterdetail-app

На ваш вопрос, похоже, вы смешали локальную и серверную файловую систему. Node_modules не предоставляетсяui5 serve. И, очевидно, вы не можете вызывать XMLHttpRequest к своей файловой системе.

src="resources/sap-ui-core.js" виртуально создается / отображается сервером.

Другие вопросы по тегам