如何要求一个图像

Question

我目前正在开发一些hiccup组件，并且他们使用不同的图标。我能在代码中导入它们吗？

Answer 1

是SVG吗？将SVG标记转换为Hiccup（https://htmltohiccup.herokuapp.com/），并将其作为Reagent组件放入代码中。

Comments

这是一个SVG文件。有没有工具可以用来将SVG文件转换为SVG标记？
而且我没有找到明确的答案，但是有没有方法可以要求图像？

---

SVG是标记。只需在文本编辑器中打开svg，你就能看到标记。然后你可以将其复制/粘贴到Hiccup转换器中的html中。

或者，你也可以直接使用img标签来添加它们。

以下是描述这两种技术的链接： https://mdn.org.cn/en-US/docs/Learn/HTML/Multimedia_and_embedding/Adding_vector_graphics_to_the_Web

它们还可以用作CSS中的背景图像。你还可以将它们全部添加到字体中，然后用作字体： https://mediatemple.net/blog/tips/creating-implementing-icon-font-tutorial/

---

嗯...我也不太清楚你所说的“要求图像”是什么意思。理论上，你可以将SVG吸聚并附加到Hiccup返回的渲染html中，无论你想要放哪里。或者使用hickory https://github.com/davidsantiago/hickory将其转换为Hiccup，并在渲染前将其插入Hiccup中。这是我能想到的最接近在Hiccup中要求图像的方法。

除了手动内联SVG，或者像我刚才提到的自动使用吸聚（slurp）之外，您还需要将SVG添加到您的Web服务器作为资源。然后在Hiccup中，您将有一个指向它们的URL的引用。

---

我猜意图是做一些像这样的事情
https://stackoverflow.com/a/43851378

---

如果是这种情况，这并不是技术上的“要求/导入图像”，它只是糖提供了一批处理路径的打包器。显然，你无法将图像文件（或其他文件）导入一个JS上下文中，所以我相信，例如在webpack上下文中，它将处理绝对路径/相对路径/服务路径，或者内联一个字符串（可能是转换为某种反序列化对象）。