openapi-generator: [BUG] Getting “inject() must be called from an injection context” after upgrading to Angular 11

Description

After having generated an API-client under the org.openapi.generator:5.0.0 using the org.springdoc.openapi-gradle-plugin:1.3.0, my web application crashes, giving me the following error:

main.ts:12 Error: inject() must be called from an injection context
    at injectInjectorOnly (core.js:4901)
    at Module.ɵɵinject (core.js:4911)
    at Object.ApiModule_Factory [as factory] (meditation-rest-client.js:2885)
    at R3Injector.hydrate (core.js:11158)
    at R3Injector.get (core.js:10979)
    at core.js:11016
    at Set.forEach (<anonymous>)
    at R3Injector._resolveInjectorDefTypes (core.js:11016)
    at new NgModuleRef$1 (core.js:25046)
    at NgModuleFactory$1.create (core.js:25100)

openapi-generator version

5.0.0

OpenAPI declaration file content or url

openapi: 3.0.1
info:
  title: OpenAPI definition
  version: v0
servers:
- url: http://127.0.0.1:8080
  description: Generated server url
paths:
  // ...

Generation Details

I am using the openapi-generator-gradle-plugin:

openApiGenerate {
    generatorName = 'typescript-angular'
    inputSpec = swaggerFilePath
    outputDir = apiClientOutputDir
    configOptions = [
            npmName   : 'meditation-rest-client',  // Api-client name
            npmVersion: '0.0.1',                   // Api-client version
            ngVersion : '11.0.6'
    ]
}

Steps to reproduce

Build an API-Client from a Spring Boot Application
Reference the API-Client in your Angular 11 Web-Application
ng serve
Find the error in your console

Related issues/PRs

I have tried to apply suggestions from

without success.

About this issue

Original URL
State: closed
Created 3 years ago
Comments: 26 (13 by maintainers)

Most upvoted comments

Falls ich mal in der Schweiz bin 😉

falk-stefan on Jan 15, 2021

glad it works.

macjohnny on Jan 15, 2021

Okay. So, with ./generated/meditation-rest-client being the non-compiled code of the API-Client and having

tsconfig.json
  "include": ["./generated/meditation-rest-client"]
Does not work with imports like import {Track} from 'meditation-rest-client'; instead it seems to require relative paths import {Track} from '../../../meditation-rest-client';.

This is the same for copying the code directly into <project-root>/src/core/api/meditaiton-rest-client. I’d like to avoid that because in that case I’d have to go through quite some amount of files and change these imports…

To avoid having to use relative paths, you can add a path mapping to your tsconfig.json: https://www.typescriptlang.org/docs/handbook/module-resolution.html#path-mapping i.e.

{
  "compilerOptions": {
    ...
    "paths": {
      "meditation-rest-client": ["generated/meditation-rest-client"]
    }
  }
}

So far the only way that “works” is to link the compiled version of the code but then the question would be: “Where is the rouge node_modules/ directory coming from?” or “Why does npm i install two node_modules/ directories?”

I dont know why this happens, maybe some npm install is accidentally run inside the api-client/dist folder for some reason.

macjohnny on Jan 15, 2021

I think I’ve got it. Instead of "include" I have to set compilerOptions.paths (see) like so:

/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
  "compileOnSave": false,
  "compilerOptions": {
    ..
    "paths": {
      "meditation-rest-client": ["./generated/meditation-rest-client"]
    }
  }
}

This seems to work now! 😃

falk-stefan on Jan 15, 2021

@macjohnny I’ll have to make a few changes to make sure this works but from the first look… it seems the node_modules/ directory in the API-client was indeed the issue. I’ll need some time to check a few things and keep you up to date!

Thank you so far. Thanks a lot! 😃

falk-stefan on Jan 15, 2021