angular-cli:Karma-Webpack失败，没有“这样的文件或目录" [英] angular-cli: Karma-Webpack bails with 'no such file or directory'

问题描述

我从标准Angular/systemjs的Tour of Heroes开始.现在我正在使用angular-client，它可以在dev/prod模式下平稳运行.但是我不能使用ng test进行任何测试.下列内容会吐出来(不仅对于test.ts，而且对于polyfills.ts).

I started with the Tour of Heroes with standard Angular/systemjs. Now I'm using angular-client for it and it runs smoothly in dev/prod mode. But I cannot test anything with ng test. The following gets spit out (not only for test.ts but also for polyfills.ts).

code: 'ENOENT',
errno: 34,
message: 'no such file or directory',
path: '/_karma_webpack_/src/test.ts' }

当我使用ng启动空白项目时，我无法真正找到它，只要将某些组件放入app-routing.module.ts，就会发生错误.可以肯定的是，我错过了一些显而易见的事情，因此我为此表示歉意.

I was not able to track it really down, when I started a blank project with ng, as soon as I put some component into the app-routing.module.ts the error occurred. Pretty sure, that I missed something cpmpletely obvious, so my apologies in advance for that.

如果您真的想深入研究代码(或尝试运行测试): https://github.com/ckpinguin/angular-tour-of-heroes

If you really like to look deeply into the code (or try to run the tests): https://github.com/ckpinguin/angular-tour-of-heroes

其他信息:在出现上述错误之前，每个组件都会失败，并显示一条类似的消息.我不知道为什么，因为我可以顺利运行该应用程序.

Additional info: Before the above error, every component fails with a message like that. I have no clue why, as I can run the app smoothly.

ERROR in ./src/app/heroes/hero-list.component/hero-list.component.ts
Module build failed: TypeError: Cannot read property 'getChildAt' of undefined
at refactor.findAstNodes.filter.forEach (/home/axcka01/projects/angular/tour-of-heroes/node_modules/@ngtools/webpack/src/loader.js:221:54)
at Array.forEach (native)
at _removeModuleId (/home/axcka01/projects/angular/tour-of-heroes/node_modules/@ngtools/webpack/src/loader.js:215:10)
at Promise.resolve.then.then (/home/axcka01/projects/angular/tour-of-heroes/node_modules/@ngtools/webpack/src/loader.js:298:33)
at process._tickCallback (internal/process/next_tick.js:103:7)
@ ./src/app/app.module.ts 19:30-89
@ ./src/main.ts
@ multi ./src/main.ts

推荐答案

好，所以我查看了Angular的书，发现所有(隐式)使用的组件都必须在spec.ts中声明.当我使用app.component.spec.ts测试中央主组件时，这意味着至少要使用以下内容:

OK, so I looked into my Angular book and found out, that all (implicitly) used components have to be declared in the spec.ts. As I'm testing the central master-component by using app.component.spec.ts, that means no less than using this:

TestBed.configureTestingModule({
    imports: [
        RouterTestingModule
    ],
    declarations: [ // TODO: Mock some components!
        AppComponent, HeroListComponent, HeroDetailComponent,
        DashboardComponent, HeroSearchComponent, HeroAddComponent
    ],
}).compileComponents()

...不仅仅是在声明中包含AppComponent！

...instead of just having the AppComponent in the declaration!

因此，错误无非是因果报应的(令人困惑的)表达方式:我需要加载组件，但不能使用它们，因为在此测试用例中未声明它们."(请纠正我的意思.我错了.)

So the error was nothing else than karma's (confusing) way to say: „I need to load components, but cannot use them, because they're not declarated in this test case." (please just correct me if I'm wrong).

我知道，通常不应该对所有子组件都进行所有组件之母"的测试.取而代之的是，只能测试最小的集合或使用模拟.但是随着app.component.spec.ts的上述更改，香草ng-cli测试用例至少现在可以运行.

I know, normally one should not test „The mother of all components" with all sub-components. Instead one would only test the smallest set or using mocks. But with the above change in app.component.spec.ts, the vanilla ng-cli test cases at least run now.

这篇关于angular-cli:Karma-Webpack失败，没有“这样的文件或目录"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！