# Discourse Reactions 不支持非常规免费图标（对喜欢图标添加了 far- 前缀）

**URL:** <https://meta.discourse.org/t/discourse-reactions-does-not-support-non-regular-free-icons-far-prefix-is-added-to-like-icon/308408>\
**Category:** Bug\
**Tags:** reactions\
**Created:** [2024年五月17日 10:00 UTC](https://meta.discourse.org/t/discourse-reactions-does-not-support-non-regular-free-icons-far-prefix-is-added-to-like-icon/308408 "2024-05-17T10:00:23Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Tris20](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tris20/32/264639_2.png) [@Tris20](https://meta.discourse.org/u/Tris20)\
**Post date:** [2024年五月17日 10:00 UTC](https://meta.discourse.org/t/discourse-reactions-does-not-support-non-regular-free-icons-far-prefix-is-added-to-like-icon/308408/1 "2024-05-17T10:00:23Z")

</div>

我正尝试添加这个[免费、实心、啤酒图标](https://fontawesome.com/v5/search?q=beer&o=r&m=free)作为我的“discourse reactions like icon”：

 ![image](https://global.discourse-cdn.com/meta/original/4X/e/0/0/e00f2c86f44660dfe3703d7cf4dc1b3a33a98436.png)

不幸的是，“beer”文本前面添加了“far-”前缀：

 ![image](https://global.discourse-cdn.com/meta/original/4X/f/8/a/f8aeab6247e0d47566d8658e75e2dc503b28efdf.png)

并且常规图标不包含在免费套餐中：

 ![image](https://global.discourse-cdn.com/meta/original/4X/5/a/0/5a06828158ab76fb48195d2d28d75f09bd6690b9.png)

因此图标无法加载：

![image](https://global.discourse-cdn.com/meta/original/4X/7/f/2/7f27d02a0f74a5ebe1c5978bcb9c768a13e0989f.png)

如果这是故意的，有什么解决方法吗？

---

<div class="post-metadata">

**Author:** ![Firepup650](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/firepup650/32/465200_2.png) [@Firepup650](https://meta.discourse.org/u/Firepup650)\
**Post date:** [2024年五月17日 10:45 UTC](https://meta.discourse.org/t/discourse-reactions-does-not-support-non-regular-free-icons-far-prefix-is-added-to-like-icon/308408/2 "2024-05-17T10:45:04Z")

</div>

`fas-beer` 作为图标名称是否能用，这纯属偶然？

---

<div class="post-metadata">

**Author:** ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)\
**Post date:** [2024年五月17日 11:07 UTC](https://meta.discourse.org/t/discourse-reactions-does-not-support-non-regular-free-icons-far-prefix-is-added-to-like-icon/308408/3 "2024-05-17T11:07:16Z")

</div>

图标在无法点赞时可以正常工作，但在可以点赞时却不行。

 ![image](https://global.discourse-cdn.com/meta/original/4X/f/9/4/f94614899b82d7d745c21218be9da8527c2b7842.png)

查看代码，当你已点赞时：

[https://github.com/discourse/discourse-reactions/blob/main/assets/javascripts/discourse/widgets/discourse-reactions-reaction-button.js#L107-L115](https://github.com/discourse/discourse-reactions/blob/main/assets/javascripts/discourse/widgets/discourse-reactions-reaction-button.js#L107-L115)

当你尚未点赞时：

[https://github.com/discourse/discourse-reactions/blob/main/assets/javascripts/discourse/widgets/discourse-reactions-reaction-button.js#L130-L136](https://github.com/discourse/discourse-reactions/blob/main/assets/javascripts/discourse/widgets/discourse-reactions-reaction-button.js#L130-L136)

它期望一个 `far—` 版本，但 `beer` 似乎不存在。 🤔

一个快速的解决方案是使用 API 替换 `far-beer`，例如：

```js
<script type="text/discourse-plugin" version="0.8">
    api.replaceIcon("far-beer", "beer");
</script>

```

我不知道是否应该在这里引入一个新设置，或者添加一些逻辑来使用相同的非-far 版本（如果 far 版本不存在）。 🤔

---

<div class="post-metadata">

**Author:** ![Tris20](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tris20/32/264639_2.png) [@Tris20](https://meta.discourse.org/u/Tris20)\
**Post date:** [2024年五月21日 09:53 UTC](https://meta.discourse.org/t/discourse-reactions-does-not-support-non-regular-free-icons-far-prefix-is-added-to-like-icon/308408/4 "2024-05-21T09:53:06Z")

</div>

> [@Firepup650](#):
>
> 碰巧的是，`fas-beer` 作为图标名称是否可用？

可惜不行，它和上面一样是空的。

> [@Arkshine](#):
>
> 在您的情况下，一个快速的解决方案是使用 API 替换 `far-beer`，例如：
> 
> ```plaintext
> <script type="text/discourse-plugin" version="0.8">
> api.replaceIcon("far-beer", "beer");
> </script>
> 
> ```

感谢您对此进行详细的查看。在可预见的将来，使用上面的 HTML 绝对是一个很好的解决方法。我们最初是这样替换心形图标的，但我完全忘记了它也可以再次用于替换 far-beer。

---

<div class="post-metadata">

**Author:** ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)\
**Post date:** [2024年五月28日 19:05 UTC](https://meta.discourse.org/t/discourse-reactions-does-not-support-non-regular-free-icons-far-prefix-is-added-to-like-icon/308408/5 "2024-05-28T19:05:09Z")

</div>

7 个帖子被拆分到一个新主题：[替换表情符号中的 ❤ 图标时出现问题](https://meta.discourse.org/t/problems-replacing-the-icon-in-reactions/309744)

---

<div class="post-metadata">

**Author:** ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)\
**Post date:** [2026年三月26日 10:06 UTC](https://meta.discourse.org/t/discourse-reactions-does-not-support-non-regular-free-icons-far-prefix-is-added-to-like-icon/308408/6 "2026-03-26T10:06:51Z")

</div>

我认为这已经在

> <https://github.com/discourse/discourse/pull/38779>
>
> This new setting type will use an IconPicker component
> instead of requiring the… admin to type in a FontAwesome icon name. This
> will make it easier for admins to select icons and reduce errors from
> typos.
> 
> The \`discourse\_reactions\_like\_icon\` setting in reactions will be
> the first to use this.
> 
> \<img width="911" height="411" alt="image" src="https://github.com/user-attachments/assets/2bbadfe6-8318-4e09-b05e-00de6b7e266f" /\>

中修复了

现在有一个检查，看是否存在常规图标，并以实心版本作为后备

> <https://github.com/discourse/discourse/blob/224ac3145fb6ab59256563e60ac39d8a3956c553/plugins/discourse-reactions/assets/javascripts/discourse/components/discourse-reactions-reaction-button.gjs#L80>