angular - Angular / Ivy 错误：错误：Token InjectionToken XXXXXXXXX 缺少 ɵprov 定义

Question

更新到 Angular 9 / Ivy 编译器后出现错误

ERROR Error: Token InjectionToken XXXXXXXXX is missing a ɵprov definition.
    at injectableDefOrInjectorDefFactory (vendor.js:47105)
    at providerToFactory (vendor.js:47210)
    at resolveProvider$1 (vendor.js:56430)

Answer 1

如果您尝试使用undefined或显式覆盖继承的可注射，则可能会发生这种情况null。

在 Angular 8 中，这没问题

    {
        provide: AMBIENT_CART,
        useExisting: undefined
    }

对于 Angular 9，它需要更改为

    {
        provide: AMBIENT_CART,
        useValue: undefined
    }

如果您好奇：就我而言，出于安全原因，我这样做是为了确保我没有错误地使用这种特殊的注射剂。

Answer 2

从 Angular 8 --> 9 升级后运行 ng test 时出现同样的错误：“错误：令牌注入令牌 apiToken 缺少 ɵprov 定义。”

我对此的解决方案非常简单——规范文件中有一个错字，我猜这在 Angular 8 中并不重要，但在 Angular 9 中呢？下面“useValue”的最后一个实例被错误地写为“usevalue”。如此隐晦的错误！

TestBed.configureTestingModule({ 
    imports: [ HttpClientTestingModule ], 
    providers: [ 
        { provide: ApiService, useValue: apiService }, 
        { provide: ProductsApiService, useValue: productsService }, 
        { provide: apiToken, useValue: mockApiToken } 
    ] 
});

Answer 3

在将应用程序从 Angular 8 升级到 Angular 10 后，我在运行单元测试时开始收到此错误。出现此问题的原因是使用现有规范文件value而不是useValue在提供程序数组中使用，如下面的示例所示。通过将其更改为 修复了该问题useValue。

    beforeEach(async(() => {
    void TestBed.configureTestingModule({
        declarations: [
            MockPipe(TranslatePipe),
        ],
        imports: [
            HttpClientTestingModule,
        ],
        providers: [
            FormBuilder,
            MessageService,
            { provide: MESSAGES_TOKEN, value: {} }, //changed to useValue
        ]
    }).compileComponents();
}));

Answer 4

当我将Angular更新到版本>= 9时，我遇到了同样的错误（Token InjectionToken XxXxXxXx 缺少 ɵprov 定义），特别是当我运行测试并且这些测试的提供者为来自Angular Material的MatDialogRef和MAT_DIALOG_DATA时。

我的解决方案是替换beforeEach()部分中的提供程序配置。看着：

之前：

import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';

beforeEach(async(() => {
            TestBed.configureTestingModule({
                    imports : [
                        ...
                    ],
                    declarations: [
                        ...
                    ],
                    providers: [
                        { provide: MatDialogRef },
                        { provide: MAT_DIALOG_DATA }
                    ]
            }).compileComponents();

    })); 

之后：

import { MAT_DIALOG_DEFAULT_OPTIONS } from '@angular/material/dialog';

beforeEach(async(() => {
            TestBed.configureTestingModule({
                    imports : [
                        ...
                    ],
                    declarations: [
                        ...
                    ],
                    providers: [{
                        provide: MAT_DIALOG_DEFAULT_OPTIONS, useValue: {hasBackdrop: false}
                    }]
            }).compileComponents();