Fel*_*lix 6 typescript angular injection-tokens
我有一个带有 Jest 的 Angular 应用程序,所有测试都运行良好。组件注入服务:
组件.ts:
import { FooService } from '../../services/foo.service'; // relative import
constructor(private foo: FooService) {}
Run Code Online (Sandbox Code Playgroud)
组件规格:
import { FooService } from '@services/foo.service'; // alias import
describe('FooComponent', () => {
let component: FooComponent;
let fixture: ComponentFixture<FooComponent>;
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
imports: [....],
providers: [ { provide: FooService, useValue: { bar: () => {} } ],
declarations: [FooComponent],
schemas: [NO_ERRORS_SCHEMA]
})
.compileComponents();
....
}));
});
Run Code Online (Sandbox Code Playgroud)
两个导入引用相同 foo.service.ts
,但使用不同形式的导入:TypeScript 别名vs相对路径。
别名在 tsconfig.json 中定义:
"paths": {
"@services/*": ["./app/services/*"]
}
Run Code Online (Sandbox Code Playgroud)
和笑话配置:
"moduleNameMapper": {
"@services/(.*)": "<rootDir>/src/app/services/$1"
}
Run Code Online (Sandbox Code Playgroud)
我已切换到 nx 工作区,测试开始失败,并出现错误,指出FooService没有提供程序:
NullInjectorError: R3InjectorError(DynamicTestModule)[FooService -> FooService]:
NullInjectorError: No provider for FooService!
Run Code Online (Sandbox Code Playgroud)
我已设法使用相同形式的导入来修复它- 服务和测试都必须使用别名导入或相对导入。
我想了解这里的问题是什么。看起来 Angular/Jest 正在基于 TypeScript 路径(在 Nx 工作区中)进行注入令牌/依赖项解析。有任何解释这是如何工作的吗?
归档时间: |
|
查看次数: |
1213 次 |
最近记录: |