Allow to serve dist folder, e.g. ui5 serve --dist

[petermuessig]

Expected Behavior

I would like to be able to serve the dist resources via the ui5 serve command, e.g. via a dedicated command line options like --dist.

Current Behavior

As of today, the best workaround is to create a separate ui5.yaml file (e.g. ui5-dist.yaml) which shifts the project resources configuration for webapp to the dist folder:

specVersion: ‘1.0’
metadata:
 name: openui5-sample-app
type: application
resources:
 configuration:
   paths:
     webapp: dist

Now the project can be served from the dist folder via ui5 serve --config ui5-dist.yaml.

[codeworrior]

This is already on the roadmap for the ui5 tooling.

[petermuessig]

Thanks @codeworrior , I remember again - but I also wanted to document this simple idea here of having just two configuration files and use one for serve from dist.

[piejanssens]

It has been on the roadmap for quite some time :-) Any updates in sight?

[matz3]

No progress so far and it's also not planned for the next time.

Is there something that you especially expect compared to the workaround mentioned above or using a separate HTTP server like local-web-server to serve the dist folder?

[piejanssens]

AFAIK it doesn't support relatively loading src="resources/sap-ui-core.js" as ui5 serve seems to do.

specVersion: ‘2.0’
metadata:
 name: openui5-sample-app
type: application
resources:
 configuration:
   paths:
     webapp: dist

ui5 build
ui5 serve --config ui5-dist.yaml

This results in the following error when loading the UI5 app. sap-ui-core.js:1 Failed to load resource: the server responded with a status of 404 (Not Found)

[RandomByte]

sap-ui-core.js:1 Failed to load resource: the server responded with a status of 404 (Not Found)

ui5 build only builds the project itself.

For sap-ui-core.js (a file from the sap.ui.core library) to be available in the build result, you need to build your project plus its dependencies using ui5 build --all

[nhebling]

Has this been added in the meantime. I'm exactly looking for that as I'm trying to include a third-party npm module + having the sources of my UI5-library project in TypeScript. Currently it's pretty complicated to setup and understand as there are various tools, shims, tasks etc. required for "just" including an npm-library and fixing the paths. Now it seems that in the "dist" folder everything looks pretty good and I just want to take that output and run ui5 serve. If I do it now ui5-serve will run an intermediate build result where the reference to the npm-library still does not work (always looks for it on "https://ui5.sap.com/resources/" (don't know why this is the default for anything non- "sap/" and not a local lookup)...so it would require possibly another task, tool, shim or whatever to fix that intermediate build results to be able to run via ui5-server. Would be nice if there would be a small parameter to just run "ui5 serve" from the "dist" folder. Easy and understandable.

[RandomByte]

Thanks for sharing your experience @nhebling!

If you don't mind, it would help us understanding your scenario better if you could roughly describe your setup. What kind of third-party npm module are you using (something generic JS-library like D3 or something UI5 specific?) and which custom tasks/middleware you are using (something for compiling TypeScript too?).

always looks for it on "ui5.sap.com/resources"

This sounds like your index.html uses ui5.sap.com for bootstrapping UI5. So all libraries will be attempted to be loaded from there by default. You could either configure the UI5 loader and tell it where to look load the namespaces of your npm-libraries from: https://sapui5.hana.ondemand.com/sdk/#/api/sap.ui.loader%23methods/sap.ui.loader.config

Or (probably more intuitively), bootstrap UI5 from localhost too. See for example the openui5-sample-app: https://github.com/SAP/openui5-sample-app/blob/70ee8f2dca892264a7c683d40004e11a5700bbab/webapp/index.html#L9

But I do wonder why the build result in your "dist" folder does not have this issue. Are you using a different HTML for starting your application there?

Would be nice if there would be a small parameter to just run "ui5 serve" from the "dist" folder. Easy and understandable.

Do you expect ui5-server middleware to continue running in this scenario or do you expect a plain HTTP server, serving the build result?

In general, I would rather try and fix the "ui5 serve" setup. Maybe through the addition of custom tasks. This should typically allow for a faster workflow than having to rebuild the whole project on every change.