我正在使用 grunt/karma/phantomjs/jasmine 对我的指令之一（angularjs）进行单元测试。我的测试运行良好
describe('bar foo', function () {
beforeEach(inject(function ($rootScope, $compile) {
elm = angular.element('<img bar-foo src="img1.png"/>');
scope = $rootScope.$new();
$compile(elm)();
scope.$digest();
}));
....
});
但我确实得到了这些 404
WARN [web-server]: 404: /img1.png
WARN [web-server]: 404: /img2.png
...
尽管它们什么都不做，但它们确实给日志输出增加了噪音。有没有办法解决这个问题 ？（当然不改变 karma 的 logLevel，因为我确实想看到它们）
那是因为您需要配置 karma 来加载，然后在需要时为它们提供服务；)
在您的 karma.conf.js 文件中，您应该已经定义了文件和/或模式，例如：
// list of files / patterns to load in the browser
files : [
{pattern: 'app/lib/angular.js', watched: true, included: true, served: true},
{pattern: 'app/lib/angular-*.js', watched: true, included: true, served: true},
{pattern: 'app/lib/**/*.js', watched: true, included: true, served: true},
{pattern: 'app/js/**/*.js', watched: true, included: true, served: true},
// add the line below with the correct path pattern for your case
{pattern: 'path/to/**/*.png', watched: false, included: false, served: true},
// important: notice that "included" must be false to avoid errors
// otherwise Karma will include them as scripts
{pattern: 'test/lib/**/*.js', watched: true, included: true, served: true},
{pattern: 'test/unit/**/*.js', watched: true, included: true, served: true},
],
// list of files to exclude
exclude: [
],
// ...
你可以看看这里了解更多信息:)
编辑：如果您使用 nodejs 网络服务器来运行您的应用程序，您可以将其添加到 karma.conf.js ：
proxies: {
'/path/to/img/': 'http://localhost:8000/path/to/img/'
},
EDIT2 ：如果您不使用或想使用另一台服务器，您可以定义本地代理，但由于 Karma 不提供对正在使用的端口的访问，动态地，如果 karma 在 9876（默认）以外的其他端口上启动，您仍然会得到那些烦人的 404 ......
proxies = {
'/images/': '/base/images/'
};
对我来说，最令人困惑的部分是“基本”虚拟文件夹。如果您不知道需要将其包含在您的装置的资产路径中，您会发现很难调试。
根据配置文档
默认情况下，所有资产都在http://localhost:[PORT]/base/
注意：对于其他版本，这可能不是真的 - 我在 0.12.14 上，它对我有用，但 0.10 文档没有提到它。
指定文件模式后：
{ pattern: 'Test/images/*.gif', watched: false, included: false, served: true, nocache: false },
我可以在我的装置中使用它：
<img src="base/Test/images/myimage.gif" />
那时我不需要代理。
您可以在 karma.conf.js 中创建通用中间件 - 有点过头，但为我完成了这项工作
首先定义虚拟 1px 图像（我使用的是 base64）：
const DUMMIES = {
png: {
base64: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNkYPhfDwAChwGA60e6kgAAAABJRU5ErkJggg==',
type: 'image/png'
},
jpg: {
base64: 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCAABAAEDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD3+iiigD//2Q==',
type: 'image/jpeg'
},
gif: {
base64: 'data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA=',
type: 'image/gif'
}
};
然后定义中间件函数：
function surpassImage404sMiddleware(req, res, next) {
const imageExt = req.url.split('.').pop();
const dummy = DUMMIES[imageExt];
if (dummy) {
// Table of files to ignore
const imgPaths = ['/another-cat-image.png'];
const isFakeImage = imgPaths.indexOf(req.url) !== -1;
// URL to ignore
const isCMSImage = req.url.indexOf('/cms/images/') !== -1;
if (isFakeImage || isCMSImage) {
const img = Buffer.from(dummy.base64, 'base64');
res.writeHead(200, {
'Content-Type': dummy.type,
'Content-Length': img.length
});
return res.end(img);
}
}
next();
}
在你的 karma conf 中应用中间件
{
basePath: '',
frameworks: ['jasmine', '@angular/cli'],
middleware: ['surpassImage404sMiddleware'],
plugins: [
...
{'middleware:surpassImage404sMiddleware': ['value', surpassImage404sMiddleware]}
],
...
}
根据@glepretre 的回答，我创建了一个空的 .png 文件并将其添加到配置中以隐藏 404 警告：
proxies: {
'/img/generic.png': 'test/assets/img/generic.png'
}
要修复，请karma.conf.js确保使用代理指向提供的文件：
files: [
{ pattern: './src/img/fake.jpg', watched: false, included: false, served: true },
],
proxies: {
'/image.jpg': '/base/src/img/fake.jpg',
'/fake-avatar': '/base/src/img/fake.jpg',
'/folder/0x500.jpg': '/base/src/img/fake.jpg',
'/undefined': '/base/src/img/fake.jpg'
}