Miragejs：无法加载离子图标 - 数据：image/svg+xml

Question

浏览器控制台中出现以下错误，并且图标未渲染。

Object { description: "Mirage: undefined", fileName: "http://localhost:8100/js/chunk-vendors.js line 2021 > eval", lineNumber: 806,
message: "Mirage: Your app tried to GET 'data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Person</title><path d='M332.64 64.58C313.18 43.57 286 32 256 32c-30.16 0-57.43 11.5-76.8 32.38-19.58 21.11-29.12 49.8-26.88 80.78C156.76 206.28 203.27 256 256 256s99.16-49.71 103.67-110.82c2.27-30.7-7.33-59.33-27.03-80.6zM432 480H80a31 31 0 01-24.2-11.13c-6.5-7.77-9.12-18.38-7.18-29.11C57.06 392.94 83.4 353.61 124.8 326c36.78-24.51 83.37-38 131.2-38s94.42 13.5 131.2 38c41.4 27.6 67.74 66.93 76.18 113.75 1.94 10.73-.68 21.34-7.18 29.11A31 31 0 01432 480z'/></svg>',
but there was no route defined to handle this request.
Define a route for this endpoint in your routes() config.
Did you forget to define a namespace?", name: "Error", number: undefined, stack: "Mirage: MirageError@webpack-internal:///.

尝试添加

this.passthrough();

及其组合，但无济于事。它适用于 API 调用，但不适用于这种特殊情况，我的意思是图标未渲染。

我们如何忽略/传递

data:image/svg+xml;utf8,...

的请求？

Answer 1

我也遇到了同样的问题。如果添加此配置以允许加载 svgs 等 Base64 图像，则可以解决该错误：

new Server({
  routes() {
    this.pretender.get('data:image/*', this.pretender.passthrough);
  }
});

希望这也适合你。