6

We are currently migrating a loopback3 application to loopback4. The migration of the server is steight forward, but migrating the angular client seems become an issue because of the "sdk".

For loopback3 we used @mean-expert/loopback-sdk-builder to generate a client sdk for angular6+. This project seems reaced end-of-life and is not compatible with loopback4.

Generating the sdk for loopback3 worked for us that way:

package.json of server:

"scripts": {
    "gen-sdk": "node ./node_modules/@mean-expert/loopback-sdk-builder/bin/lb-sdk src/server.js ../frontend/src/app/shared/sdk --wipe=enabled"
}

The generator starts a copy of the server, reads different internal metadata and writes the generated files to the client project - as far i can see it does not make use of the swagger.json provided by loopback3.

We are searching for an alternative sdk to use with loopback4. The backend provides a openapi.json to describe the endpoints.

Which sdk do you use in your angular projects (ideally written in TypeScript)? Is there a sdk which generated code is mostly compatible with @mean-expert/loopback-sdk-builder?

So far I found and tested the following projects to generate a openapi client:

  • openapi-generator
    • con: is written in Java
    • con: throws NullpointerExceptions all the time (maybe our openapi.json is not correct, but this generator does not provide useful error messages)
  • ng-openapi-gen
    • pro: is written in TypeScript
    • con: the generated operation names are really strage, maybe only in combination with loopback4?
    • con: the project does not seem to be very active

Which angular setup do you suggest to talk to an loopback4 rest backend?

derdeka
  • 226
  • 1
  • 5

1 Answers1

0

The Loopback 4 project addresses this issue with their documentation on Building an Angular Application from OpenAPI Specification

A summary of the steps are:

  1. In your Loopback 4 project generate the openapi-spec from your controllers with the command npm run openapi-spec to generate an OpenAPI JSON file.
  2. In your Angular application use the ng-openapi-gen package to generate Angular API stubs from the OpenAPI JSON file in the previous step. For example:

ng-openapi-gen --input <path-to-openapi-json> --output <angular-app-path>/src/app/api

The contents of the <angular-app-path>/src/app/api directory contain models for the API to use within Angular. See their documentation for a complete example.

jbratu
  • 1