geert-janklaps / cds-launchpad-plugin

Launchpad Plugin for demo / development / testing SAP CAP-based projects
MIT License
12 stars 15 forks source link

Typescript support for UI5 app #13

Closed js1972 closed 8 months ago

js1972 commented 10 months ago

If the ui5 apps are written in Typescript this plugin does not seem to work for me. Maybe I am missing some setting? I use the cds-plugin-ui5 plugin which ties the ui5 build system (typescript compile etc) into cds watch. It seems the setup of cds-launchpad-plugin runs before that process kicks in and there is no Component.js yet.

petermuessig commented 10 months ago

Hi @geert-janklaps ,

the cds-launchpad-plugin is currently not working together with the cds-plugin-ui5. You are relying on the existence of the files on the file system - but for the TypeScript compilation the cds-plugin-ui5 is enabling the usage of the UI5 tooling middlewares such as the ui5-tooling-transpile. Is it necessary to create the component preload or can you make that step optional (for now) to make the classic component loading with TypeScript work? You can maybe probe the existence of the Component.js and if it is not available just skip the generation of the component preload?

WDYT?

What I could foresee is maybe a UI5 tooling middleware which creates the component preload bundles on the fly - but it needs to have an understanding of the available resources and also if some resources are dynamically created but middlewares (in the dev server) or tasks (during the build). I think this is a bit more complicated...

BR, Peter

geert-janklaps commented 10 months ago

Hi @petermuessig,

If the only issue is the component preloading, I personally don't see a reason why we couldn't make it optional as you describe. (the initial version didn't include this feature, it is a recently introduced feature) Do you by any chance have sample repository that I can use?

Currently I'm only using typescript for CAP in my projects (planning to do the migration to typescript for the apps as well). But don't have a project up and running. (If you don't have a sample repo, I'll setup one myself, just to buy me some time)

By the way, I'm planning to look into some additional improvements as well (e.g. the way the launchpad is initialized which is using a now deprecated method: sap.ushell.Container.createRenderer() )

Cheers, Geert-Jan

js1972 commented 10 months ago

Hi @geert-janklaps I can add you to one of my repo's if you like - for testing - or alternatively you can quickly setup a test project by:

  1. cds init \<test project> && cd \<test project>
  2. cds add tiny-sample
  3. Then use fiori tools app generator / template wizard to add a fiori elements app and ensure to choose the following under configure advanced options:
  4. Enable Typescript

Then you'll have a minimal sample where you can add this launchpad project.

geert-janklaps commented 10 months ago

Hi Jason, Peter,

Thanks for the tip! Due to my unavailability today & tomorrow, I'll probably do the required changes tomorrow night / saturday. If all goes well, you should be able to use this by monday!

Cheers, Geert-Jan

geert-janklaps commented 10 months ago

Hi Jason, Peter,

I've added basic support for the cds-plugin-ui5 in version 2.0.2. I fixed / added:

Since the current solution is using a different route, the component-preload is not posing an issue, since this is only registered on the default cap server route. (/modulename/webapp vs /modulename)

@petermuessig,

Currently I couldn't seem to find a straight forward way to identify which mount points are registered by the cds-plugin-ui5. I see there are quite some options / levels where the default mount point can be overruled. Maybe we should align on the best way to identify which mount points are registered in cds-plugin-ui5 so I can add full support even for customized mount points.

I'm thinking out loud, but maybe exposing the mount points for each module in an environment variable could be an option?

Cheers, Geert-Jan

petermuessig commented 9 months ago

Hi @geert-janklaps ,

sry, I wanted to reply earlier and missed it. What you finally need to know are all the available routes, right?

Maybe a nice option would be to check the env variable for:

```process.env["cds-plugin-ui5"] === true````

And in this case you can wait for a custom event, e.g. "cds-plugin-ui5:started" which provides an array of routes?

WDYT?

BR, Peter

geert-janklaps commented 9 months ago

Hi @petermuessig,

Sound goods to me! Just to make sure, the array I'd need would also need to contain the component. (to be able to identity which route is linked to which component).

Once you have such an event available, just let me know and I'll look into implementing the necessary logic in the launchpad plugin.

Cheers, Geert-Jan

gregorwolf commented 8 months ago

Is this also solved by #35 ? CC @marianfoo

marianfoo commented 8 months ago

Maybe it is solved, but I'm not sure what technical problems are still there.

marianfoo commented 8 months ago

Hi @geert-janklaps I can add you to one of my repo's if you like - for testing - or alternatively you can quickly setup a test project by:

  1. cds init && cd
  2. cds add tiny-sample
  3. Then use fiori tools app generator / template wizard to add a fiori elements app and ensure to choose the following under configure advanced options:
  4. Enable Typescript

Then you'll have a minimal sample where you can add this launchpad project.

@js1972 i added a test case for typescript app like you described above and using cds-plugin-ui5 and it works for me

see PR #37

geert-janklaps commented 8 months ago

This one was already working. The only case that is not covered is if you choose to use custom routes for cds-plugin-ui5. (currently only default routes are supported)