我是 webpack 新手，有一个关于测试的问题。
我有一个使用 webpack、typescript 和 karma 作为测试运行器的项目，我想在每次文件更改时运行我的测试（例如在“监视”模式下）
我知道 karma-webpack 并且当我将 karma 作为自己的进程运行时它运行良好（karma start ...）
但我想要的是在 webpack 流程中集成 karma。 所以，从我幼稚的角度来看，我认为 karma 必须在 webpack 的预加载（例如 linter）中定义。
但我什么也没找到.... 我不敢相信这种常见的工作流程是不可能的（对每个源更改运行测试）
谁能给我一个建议？
【问题讨论】：
标签： testing tdd karma-runner webpack webpack-dev-server
时间过得真快，2018 年 6 月已经过去了。由于网上没有太多关于此的文档，我想捐出我的 2 美分。
我目前有一个设置工作，我将我的测试与 webpack 捆绑在一起，监视更改以便自动重新运行测试。
我正在使用karma-webpack 使用Alternative usage 部分中解释的配置，我认为这是解决问题中提出的问题的正确方法。
karma.conf.js
{
...
files: [
// only specify one entry point
// and require all tests in there
'test/index_test.js'
],
preprocessors: {
// add webpack as preprocessor
'test/index_test.js': [ 'webpack' ]
},
...
}
test/index_test.js
// require all modules ending in "_test" from the
// current directory and all subdirectories
const testsContext = require.context(".", true, /_test$/)
testsContext.keys().forEach(testsContext)
在我看来，按照@Adi Prasetyo 的建议关注整个捆绑包的变化是错误的。我们应该只注意测试文件和其中导入的文件的变化，这可以通过最后一个 URL 中显示的配置来实现。
对于热重载的工作非常重要（至少在我的情况下是它工作的原因），您需要设置 webpack-dev-middleware 配置，以便在某些测试文件中发生更改时更新测试包或在其中导入的文件。这是我正在使用的配置：
karma.config.js
{
...
webpackMiddleware: {
watchOptions: {
aggregateTimeout: 300,
poll: 1000, // customize depending on PC power
},
},
...
}
更多信息here。
【讨论】：
我有同样的问题，因为我使用的 TDD 工作流程。编写测试后更改代码测试不会重新运行。可以对每个文件更改运行测试。
karma files 有 3 个选项：包含、服务、观看。
您可以将捆绑包指定为模式，然后告诉 karma 观看它
karma.config.js
files: [
// watch final file so when source change and it's final file, re run the test
{ pattern: './dist/js/*.wp.js', watched: true},
],
但是当我们使用karma start 时，没有 webpack 活动和观看。所以使用concurrently 来运行 karma 和 webpack。请注意，webpack 应该只关注源代码，而 karma 应该关注捆绑文件。
然后我们可以像这样将脚本属性添加到package.json
package.json
"scripts": {
"test": "karma start karma.config.js",
"build": "webpack",
"dev": "concurrently \"webpack --progress --colors --watch\" \"karma start karma.config.js --colors\"",
},
然后运行npm run dev开始编码
【讨论】：
嗯，直到现在我还没有听说过 webpack，但我对 karma 非常了解。我不是 100% 确定你在这里问什么，所以如果这根本没有帮助，请告诉我。您可以设置 karma 以完全按照您的意愿进行操作（在每次文件更改时运行测试）。
您必须在karma.conf.js 文件中设置两个选项：autoWatch: true 和singleRun: false。
karma.conf.js
module.exports = function(config) {
config.set({
// set other options and stuff...
autoWatch: true,
singleRun: false
});
};
autoWatch 设置为 true 可以在任何文件更改时监视文件并执行测试。将 singleRun 设置为 false 意味着您只需要执行一次 karma start（或者将其集成到 webpack 中）即可运行测试，而不必每次进行更改或想要运行时都输入命令套房;它只是让业力在后台运行。
【讨论】：