gpt4 book ai didi

typescript - 桶装进口似乎打破了装载顺序

转载 作者:搜寻专家 更新时间:2023-10-30 21:24:41 24 4
gpt4 key购买 nike

我有一个组件正在尝试进行单元测试,但我不断收到这些错误,具体取决于我的导入语句:

Error: Cannot resolve all parameters for 'MyComponent'(undefined, FormBuilder).

TypeError: Cannot read property 'toString' of undefined

我的组件有 2 个参数,一个是 FormBuilder,一个是必须注入(inject)的自定义服务:

import {MyService} from '../';

@Component({
...,
providers: [MyService]
})
class MyComponent {
constructor(service: MyService, fb: FormBuilder) { ... }
...
}

我的单元测试设置如下:

import {MyComponent} from './';
import {MyService} from '../';

describe('Component: MyComponent', () => {

let builder: TestComponentBuilder;

beforeEachProviders(() => [
MyService,
MyComponent
]);

beforeEach(inject([TestComponentBuilder], function (tcb: TestComponentBuilder) {
builder = tcb;
}));

it('should inject the component', inject([MyComponent],
(component: MyComponent) => {
expect(component).toBeTruthy();
})
);

}

进口似乎是问题所在,因为我正在尝试使用桶:

|
|- my-component
| |- index.ts
| |- my.component.ts
| |- my.component.spec.ts
|
|- my-service
| |- index.ts
| |- my.service.ts
|
|- index.ts

在我的 index.ts 文件中,我正在做:

export * from '<filename>';
export * from '<directory>';

视情况而定。

但是,当我将单元测试和组件中的导入更改为直接引用服务文件时,单元测试就可以工作了。

import {MyService} from '../my-service/my.service';

我在这个项目中使用 angular-cli,SystemJS 正在使用生成的配置文件进行配置:

...
const barrels: string[] = [
...,

// App specific barrels.
'app',
'app/my-service',
'app/my-component'
/** @cli-barrel */
];

const cliSystemConfigPackages: any = {};
barrels.forEach((barrelName: string) => {
cliSystemConfigPackages[barrelName] = { main: 'index' };
});

/** Type declaration for ambient System. */
declare var System: any;

// Apply the CLI SystemJS configuration.
System.config({
map: {
'@angular': 'vendor/@angular',
'rxjs': 'vendor/rxjs',
'main': 'main.js'
},
packages: cliSystemConfigPackages
});
...

似乎当我从桶中导入时,组件和服务定义并没有在单元测试代码之前加载。无论哪种方式,应用程序本身都会转换和运行。

抱歉,如果这是一个广泛的问题,但我对 barrels 和 SystemJS 还是很陌生,我不知道如何进一步缩小范围:

这是 SystemJS/Jasmine/TypeScript/Angular2 的错误还是我在我的设置中做错了什么?

最佳答案

我必须查看您从中导入的桶中的内容才能确定,但​​听起来您需要更改桶中的导出顺序。

此处存在 angular2 存储库中的问题:https://github.com/angular/angular/issues/9334

If a component (A) imports and uses a service/component (B) from a barrel containing the exports of both A and B, and A appears before B in the barrel, the imported value of B is undefined.

因此,在您的情况下,如果您将根 index.ts 修改为以下内容,您应该能够从您的桶中导入。

export * from my-service;
export * from my-component;

关于typescript - 桶装进口似乎打破了装载顺序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37398829/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com