使用没有 Webpack 的 Jasmine Karma 对 Angular 2 应用程序进行单元测试答案

【问题标题】：Unit Testing for Angular 2 App Using Jasmine Karma Without Webpack使用没有 Webpack 的 Jasmine Karma 对 Angular 2 应用程序进行单元测试
【发布时间】：2016-12-27 09:11:01
【问题描述】：

可以在不使用 Webpack 的情况下为 Angular 2 应用程序中的单元测试实现 Jasmine-Karma 吗？ SystemJS 不是 Webpack，而是一种解决方案，但在应用程序中同时使用 SystemJS 和 Webpack 是否正确？我正在使用 Webpack 进行应用程序的开发模式和生产模式。

【问题讨论】：

标签： unit-testing angular typescript jasmine karma-jasmine

【解决方案1】：

Karma 和 Jasmine 与 Angular2 无关，它们是可以完全独立运行的独立库。

要运行 Karma，您需要：

 npm install -g karma-cli
 karma init my.conf.js // this will create a configuration file for Karma
 karma start my.conf.js

这将查找所有测试文件并运行它们，然后在命令行中显示结果。

但是，问题是当您处理通常用 Typescript 编写的 Angular2 代码并且代码本身可能有一些额外的依赖项时，Karma 配置可能会变得很痛苦。你可能有 sass 文件需要先转换成 css 文件供 Karma 使用（你可以将 Karma 视为浏览器，它只需要 JS 和 CSS 和 HTML，仅此而已）。

就像我说的，您需要先将您的打字稿代码转译为 Javascript 以将其提供给 karma 对吧？

所以你需要有人为你处理这个小任务，这在现在通常是 webpack，过去是 gulp 和 grunt。

Webpack 是一个复杂的打包工具，它几乎可以满足您在使用 Angular 时可能需要的所有功能。

我不建议同时使用 SystemJS 和 Webpack，因为 Webpack 已经完成了 SystemJS 的工作（加载文件和...）。

【讨论】：

感谢您提供的信息。是否可以将 gulp 与 Angular 2 (TypeScript) 代码和 Jasmine-Karma 一起使用？我只找到了 systemJS 和 webpack 的链接。如果有的话，请与 Angular 2(TypeScript) 分享 gulp 的信息。提前致谢。
我可以同时使用 gulp 和 webpack 吗？还是与 SystemJS 和 Webpack 中的情况相同？