Linux系统下SVG2PNG字体不识别问题求助

问题描述 #

我正在开发一个可返回图片的Discord机器人，Windows本地运行一切正常，但部署到Linux系统后出现字体异常，字符显示为"[]"。相关代码及异常截图如下：

相关代码 #

const { SlashCommandBuilder } = require('@discordjs/builders');
const { MessageEmbed } = require('discord.js');
const { svg2png } = require('svg-png-converter');
const { MessageAttachment } = require('discord.js');
let declareCount = 0;

module.exports = {
    data: new SlashCommandBuilder()
        .setName('test')
        .setDescription('dei!'),


    async execute(interaction) {
        let svg = 
        `
        <svg height="30" width="200">
        <text x="0" y="15" fill="red">I love SVG!</text>
      </svg>
        `

          declareCount+=1;
          const outputBuffer = await svg2png({
              input: svg,
              encoding: 'buffer',
              format: 'png',
              quality: 1
          })
          await interaction.reply({
            ephemeral: false,
            content: `Test #${declareCount}`,
            files: [new MessageAttachment(outputBuffer, '${name}.png')]
        });
      },
    };

异常截图 #

解决方法 #

该问题源于Linux系统缺少SVG文本渲染所需的字体，按以下步骤处理：

• 安装基础字体包
  根据Linux发行版选择对应命令安装常用无衬线字体：

  • Debian/Ubuntu系统：

    sudo apt update && sudo apt install fonts-dejavu-core fonts-noto
    

  • CentOS/RHEL系统：

    sudo yum install dejavu-sans-fonts google-noto-sans-fonts
    

• 在SVG中明确指定字体
  修改SVG代码，给<text>标签指定已安装的字体，避免依赖系统默认缺失的字体：

  <svg height="30" width="200">
    <text x="0" y="15" fill="red" font-family="DejaVu Sans, Noto Sans, sans-serif">I love SVG!</text>
  </svg>
  

  这样渲染时会优先使用指定字体，若指定字体未找到，会自动 fallback 到系统通用无衬线字体。

• 验证字体安装状态
  执行以下命令确认字体已成功安装：

  fc-list | grep "DejaVu Sans"
  

内容的提问来源于stack exchange，提问作者zTrusted