在 React 中跟踪 SVG 图像加载

【问题标题】：Traced SVG Image loading in React在 React 中跟踪 SVG 图像加载
【发布时间】：2019-09-22 01:11:32
【问题描述】：

我最近在gatsby.js看到了traced SVG image loading

有什么方法可以让我在create-react-app 中实现这一点，自动化。现在，我使用create-react-app 和cloudinary。我将url 存储在我的数据库中，我找不到一个很好的资源来实现这一点。帮助将不胜感激。

【问题讨论】：

【解决方案1】：

如果您阅读帖子及其使用的内容，您会发现它使用https://github.com/lovell/sharp，它接受图像作为参数，在您的情况下，您可以下载图像，应用过滤器，最后使用最重要的部分技术：

<div
      style={{
        backgroundImage: `url("${realUrl}"), url("${
          tracedSVG
        }")`,
      }}
    />
  </div>

然后浏览器会为你做动态加载。

【讨论】：