ui5-community / ui5-ecosystem-showcase

A repository showcasing the UI5 tooling extensibility to combine OSS tools for UI5 application development.
https://ui5-community.github.io/ui5-ecosystem-showcase/
Other
191 stars 92 forks source link

ui5-task-transpile - regeneratorRuntime is not defined #242

Closed HeneryHawk closed 4 years ago

HeneryHawk commented 4 years ago

Hi i use the task ui5-task-transpile to compile my es6 code to es5. Unfortunately the app doesn't start after compiling because of the following error

regeneratorRuntime is not defined

I have seen the comment in the Main.controller.js of the demo app Are there any plans to implement the functionality?

Many greetings

vobu commented 4 years ago

hi, i'm assuming you're using async/await in your code. this breaks the downport to ES5 because of the missing shim, as you experienced. you can resolve this by using regenerator-runtime as a dev dependency and extending the build task. @lemaiwo has blogged about this and provided a how-to: https://blogs.sap.com/2019/08/28/ui5-tooling-custom-transpiler-babel-builder-extension-task/

hth, v.

HeneryHawk commented 4 years ago

Hi Volker thanks for your quick response. Wouldn't it be cool to extend the existing transpile plugin to include regenerator-runtime in the build?

Regards Simon

vobu commented 4 years ago

Wouldn't it be cool to extend the existing transpile plugin to include regenerator-runtime in the build?

ab-so-lutely. i'm sure both @petermuessig and me would appreciate you giving it a shot :)

petermuessig commented 4 years ago

Y-E-S! :-)

As Volker mentioned above, also @lemaiwo did it already in the past - he create a PR for another project which I did not continue anymore: https://github.com/petermuessig/my-es6-ui5-app/pull/7

lennart-m commented 4 years ago

Hi, have you considered using babel-plugin-transform-async-to-promises in order to support async/await? I find the resulting code a lot more readable and it does not require any additional code like regenerator-runtime, especially after activating the option inlineHelpers.

After all, we already have Promises in UI5.

lemaiwo commented 4 years ago

Hi ,

Merging the transpiler with the regenerator into the transpiler of Peter is on my todo list ... need to make time to create a pull request for this! :)

Your proposal is a great idea! Automatically adding the regenerator runtime requires a lot of additional config in the ui5.yaml. This Babel transpiler for Async await might be the better solution!

Kr, Wouter

Op 30 jun. 2020 om 20:51 heeft Lennart notifications@github.com het volgende geschreven:



Hi, have you considered using babel-plugin-transform-async-to-promiseshttps://www.npmjs.com/package/babel-plugin-transform-async-to-promises in order to support async/await? I find the resulting syntax a lot more readable and it does not require any additional code like regenerator-runtime, especially after activating the option inlineHelpers.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://github.com/petermuessig/ui5-ecosystem-showcase/issues/242#issuecomment-651979061, or unsubscribehttps://github.com/notifications/unsubscribe-auth/ABNK7D3FC4KXTM2POF3XNZDRZIX4XANCNFSM4OE2ZVFA.

lennart-m commented 4 years ago

Hi @lemaiwo This can be done by installing the dependency babel-plugin-transform-async-to-promises and creating a file babel.config.json in the project folder having the following content:

{
  "plugins": [
    [
      "babel-plugin-transform-async-to-promises",
      {
        "inlineHelpers": true
      }
    ]
  ]
}

No changes to the task/middleware is required.

Though the default configuration by the ui5-task-transpile will be overridden once you have a non-empty configuration in babel.config.json.

Also this does not enable usage of async generator functions, just async regular functions. But this is already quite a step forward.

lboehm commented 4 years ago

Hi @lennart-m,

from my point of view async generator functions aren't that important. Regular async functions are way more important. So this approach would absolutely meet my requirements. I would love to see this issue handled by this custom task.

Couldn't this be implemented similar to the removeConsoleStatements option, which is already implemented? I would prefer this approach, because it doesn't require a babel.config.json in the project.

It could be enabled by adding another option to custom task configuration:

builder:
  customTasks:
  - name: ui5-task-transpile
    afterTask: replaceVersion
    configuration:
      debug: true
      removeConsoleStatements: true
      transpileAsync: true                    <-- like this
      excludePatterns:
      - "lib/"
      - "another/dir/in/webapp"
      - "yet/another/dir"

In the transpile task the plugin could be loaded, if transpileAsync is set to true. (similar to this).

Best regards, Lukas

vobu commented 4 years ago

this is closed via the double-team of #260 and the (soon to be merged) #266 - thus closing this