Angular2-使用templateUrl测试组件，结果为；未经处理的拒绝承诺”；

我目前正在编写一个简单的测试来测试Angular 2组件，该组件的模板由templateUrl引用。我目前正在使用webpack执行所需的任务，包括测试。我跟在班上，也跟在班上

但是，当测试尝试创建组件夹具时，使用

testBed.createComponent(AppComponent);

我得到以下错误：

“'Unhandled Promission rejection:'，'Failed to load app.component.html'，'；Zone:'，'ProxyZone'，'；Task:'，'Promission.then'，'；Value:'，'Failed to load app.component.html'，”

因此，显然会导致测试失败

在我的app.component.ts中，我通过templateUrl引用模板，如下所示

@Component({
    selector: 'my-app',
    templateUrl: './app.component.html',
    styleUrls: [ './app.component.css' ]
})
export class AppComponent {
    title = "Tour of Heroes";
}

我环顾四周，但没有找到解决此错误的方法。有人知道这个问题吗？到目前为止，我遇到的所有示例（例如，像本报告中的示例）都包括内联html

这里有一个指向我的回购协议的链接，以防您想查看webpack/karma配置文件

---

编辑：更新了到我的回购主分支的链接。

在做了一些修改之后，我回到了升级到webpack的angular指南，并将问题缩小到以下事实：在我的webpack.test.ts文件中，我使用的是很棒的typescript加载程序，而不是与angular2模板加载程序链接的ts加载程序

在使用字母2（如在angular上提供的指南中所述）之后，测试再次开始工作，并加载模板属性

最初，我从ts加载器+angular2模板加载器转移到awesome typescript加载器，因为它被建议作为代码覆盖率重新映射的解决方案

更新：在上周的最终版本（）之后更新了webpack指南之后，我注意到该指南被更新为使用“awesome typescript loader”

---

在这种情况下，请确保使用指南中建议的“awesome typescript loader”v2.2.4。我试着按照建议使用“awesome typescript loader”，但测试再次失败。直到我意识到我使用的是1.x版本，它似乎不太好用

您正在使用模板和样式的相对路径。能否尝试将

moduleId:module.id

属性添加到组件装饰器中？如果您为commonjs设置并按照Dave V的建议使用相对路径，Angular站点会有一个记录。请确保您使用的是

ts

transpiler，而不是默认的typescript（忽略commonjs打包）。否则，您需要定义绝对路径（从index.html的位置），它将是

app/app.component.html

Hi-Guys，谢谢您的输入！正如steven所说，moduleId:module.id仅在使用SystemJs模块加载器时才是必需的。在我的例子中，因为我使用webpack作为绑定器和加载程序，所以我必须使用上面所写的语法。至于问题本身，我将其缩小到以下事实：在我的webpack.test.ts文件中，我使用了可怕的typescript加载程序，而不是ts加载程序链接的angular2模板加载程序。我很快就会回答这个问题。谢谢你们的帮助！更新的答案：）规范的ts加载器和很棒的有什么区别？我认为最好的答案来自他们的文档本身：）请指定与ts加载器的一些区别：）