获取"inject()必须从注入上下文中调用".升级到Angular 11之后 [英] Getting "inject() must be called from an injection context" after upgrading to Angular 11
问题描述
升级到Angular 11后，我不再能够 ng服务我的Web应用程序.
After upgrading to Angular 11, I am not able to ng serve my web application anymore.
我正在使用Spring Doc和最新的OpenAPI生成器gradle-plutin(5.0.0)生成客户端.
I am generating the client using Spring Doc and the latest OpenAPI generator gradle-plutin (5.0.0).
问题似乎与我的(生成的)REST客户端有关.打开https://localhost:4200会将以下内容写入控制台:
The problem appears to be related to my (generated) REST-client. Opening https://localhost:4200 will write the following into the console:
main.ts:12 Error: inject() must be called from an injection context
at injectInjectorOnly (core.js:4901) [angular]
at Module.ɵɵinject (core.js:4911) [angular]
at Object.ApiModule_Factory [as factory] (meditation-rest-client.js:2885) [angular]
at R3Injector.hydrate (core.js:11158) [angular]
at R3Injector.get (core.js:10979) [angular]
at :4200/vendor.js:82591:55 [angular]
at Set.forEach (<anonymous>) [angular]
at R3Injector._resolveInjectorDefTypes (core.js:11016) [angular]
at new NgModuleRef$1 (core.js:25046) [angular]
at NgModuleFactory$1.create (core.js:25100) [angular]
at :4200/vendor.js:100468:45 [angular]
at Object.onInvoke (core.js:28301) [angular]
以下是我的 tsconfig.json 文件:
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"downlevelIteration": true,
"experimentalDecorators": true,
"moduleResolution": "node",
"importHelpers": true,
"target": "es2015",
"module": "es2020",
"lib": [
"es2018",
"dom"
]
}
}
这是我在 package.json
"chart.js": "^2.9.4",
"core-js": "^3.8.2",
"meditation-rest-client": "./generated/meditation-rest-client",
"http-server": "^0.12.3",
"http-status-codes": "^2.1.4",
"moment": "^2.29.1",
这是上面的错误消息中引用的那些生成的行:
And this here are those generated lines which are reffered to in the error message above:
// ...
ApiModule.ɵmod = ɵngcc0.ɵɵdefineNgModule({ type: ApiModule });
ApiModule.ɵinj = ɵngcc0.ɵɵdefineInjector({ factory: function ApiModule_Factory(t) { return new (t || ApiModule)(ɵngcc0.ɵɵinject(ApiModule, 12), ɵngcc0.ɵɵinject(ɵngcc1.HttpClient, 8)); }, providers: [], imports: [[]] });
ApiModule.ctorParameters = () => [
{ type: ApiModule, decorators: [{ type: Optional }, { type: SkipSelf }] },
{ type: HttpClient, decorators: [{ type: Optional }] }
];
// ...
这曾经在Angular 9中起作用，但在Angular 11中却没有.
This used to work in Angular 9 but it won't under Angular 11.
有人知道如何解决此问题吗?我已经尝试按照建议在此处设置"preserveSymlinks":true a>和此处.
Any idea how to fix this? I already tried setting "preserveSymlinks": true as suggested here and here.
如果您需要更多信息，请告诉我.
Please let me know if you need more information.
推荐答案
由于生成的npm软件包内置在某些输出文件夹/generated/meditation-rest-client 中，因此可能会出现此问题.当由前端应用程序引用时，api包将导入的 @ angular/core 解析为/generated/meditation-rest-client/node_modules/@ angular/core ，不同从项目根目录中的/node_modules/@ angular/core 中获取.
The issue could arise due to the generated npm package builds into some output folder /generated/meditation-rest-client.
When being referenced by the frontend application, the api package resolves the import @angular/core to /generated/meditation-rest-client/node_modules/@angular/core, differing from the /node_modules/@angular/core in the project root.
解决方法是删除父目录中的/generation/meditation-rest-client/node_modules 文件夹和 node_modules 文件夹，但< project-root>/node_modules .另外，应将生成的代码/generated/meditation-rest-client 复制到没有父文件夹包含 node_modules 文件夹的某个位置.
The resolution would be to delete the /generated/meditation-rest-client/node_modules folder and the node_modules folder in the parents, except for the <project-root>/node_modules. Alternatively, the generated code /generated/meditation-rest-client should be copied to some location where no parent folder contains an node_modules folder.
请参见 https://github.com/OpenAPITools/openapi-generator/issues/8447
这篇关于获取"inject()必须从注入上下文中调用".升级到Angular 11之后的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
