#8解决 GG Discussion 类别 Emoji 无法渲染问题

本文为 AI 生成内容

并非 Bug，仅需补充映射配置

在基于 Gatsby 构建的 GG 项目中，discussion 类别的部分 emoji 无法正常渲染，排查后发现这并非代码 Bug，而是项目的 emoji 映射表未覆盖相关短代码导致，只需简单补充映射即可彻底解决。

问题现象

访问页面时，discussion 分类的 emoji 呈现异常：

• 预期效果：🙏、💬、📘、📣 等可视化表情符号；
• 实际效果：:pray:、:blue_book: 对应的位置为空（无任何 emoji 显示），仅 :speech_balloon:、:mega: 因已有映射能正常显示。

根因分析

项目中已内置 emoji.ts 文件作为 emoji 短代码与 Unicode 表情符号的映射核心，其工作逻辑为：

1. 解析 :xxx: 格式的短代码，截取中间的关键词（如 :pray: → pray）；
2. 到预设的 emojiMap 映射表中匹配对应的 Unicode 表情符号；
3. 若映射表中无该关键词，则返回空字符串，表现为对应位置无 emoji 显示。

问题本质是：discussion 类别用到的 pray、blue_book 等关键词，未出现在 emojiMap 的预设列表中，导致解析后返回空字符串，最终显示为空。

解决方案

补充 emoji 映射表

打开项目中的 emoji.ts 文件，在 emojiMap 对象中添加缺失的短代码与对应 Unicode 表情符号：

// emoji.ts
const emojiMap: Record<string, string> = {
  // 原有映射（省略）
  speech_balloon: '💬', // 已有，无需重复添加
  mega: '📣', // 已有，无需重复添加
  
  // 👇 新增缺失的映射项
  pray: '🙏',    // 对应 :pray: 短代码
  blue_book: '📘' // 对应 :blue_book: 短代码
};

export default (emoji: string): string => emojiMap[emoji.slice(1, -1)] || '';

总结

本次「emoji 无法渲染」并非代码 Bug，而是项目配置的映射表未覆盖业务所需的 emoji 短代码，导致解析后返回空字符串、对应位置无表情显示。
核心解决思路是：利用项目已有的 emoji.ts 映射机制，补充缺失的短代码-符号对应关系