Skip to content
← Back to Community
Fontconfig error: Cannot load default config file Node.js Canvas
Profile icon
CrisKop

I cant use the fillText method in a canvas image (its for a discord bot) the letters are replaced by squares

Voters
Profile icon
LuisAFK
Profile icon
serfinxx
Profile icon
MirandaInc
Profile icon
EBMOfficial
Profile icon
Aiueokashi001
Profile icon
CrisKop
Comments
hotnewtop
Profile icon
Coder100

Hello! You are in luck! Here is the solution:
First, install a font. I usually use Google Fonts
Second, install as a zip. Unzip it and drag in the font(s) of your choice.
Third, add this line of code at the top of the file:

const { registerFont } = require('canvas'); registerFont('path/to/your/font.ttf', { family: 'FontName' });

Now, you can use the font like:

ctx.font = "30px FontName";

Hope this helps! Be sure to mark as correct answer!

Profile icon
CrisKop

@Coder100 why dont work for me?

This is my code:

const { createCanvas, loadImage } = require("canvas"); const { registerFont } = require('canvas'); registerFont('fonts/ARIAL.TTF', { family: 'FontName' }); const canvas = createCanvas(300, 100); const ctx = canvas.getContext("2d"); const background = await loadImage('https://i.ibb.co/tqGBQmN/Banner.png'); ctx.drawImage(background, 0, 0, canvas.width, canvas.height); ctx.font = "17px FontName"; ctx.shadowColor = "#000000"; ctx.shadowBlur = 1; ctx.fillText("Staff Points:", 140, 102); ctx.arc(50, 50, 35, 0, Math.PI * 2, true); ctx.lineWidth = 3; ctx.strokeStyle = "#ffffff"; ctx.shadowColor = "#000000"; ctx.shadowBlur = 1; ctx.stroke(); ctx.closePath(); ctx.clip(); const avatar = await loadImage(message.author.displayAvatarURL); ctx.drawImage(avatar, 12, 10, 80, 80); const attachment = new Discord.Attachment(canvas.toBuffer(), "pts.png"); message.channel.send(attachment);
Profile icon
Coder100

so your font is fonts/ARIAL.TTF? it should be fonts/arial.ttf @CrisKop

Profile icon
CrisKop

@Coder100 no, but when i use const { registerFont } = require('canvas'); all command dont work

Profile icon
Coder100
Profile icon
CrisKop

@Coder100 and no error in the console

Profile icon
tpunn19

@Coder100, Thanks for this! I've been using this for a bit now, but it seems like foreign characters/symbols from usernames aren't exactly working with the Roboto font. Any suggestions on that?

Profile icon
OyunMknats1

I get same problem, I tried use registerFont but gives same error again, I tried with 3-4 font file( .ttf )

Profile icon
JohnFelicisimo

This is also my problem, I used heroku before, and just by making a directory named '.fonts' and putting my downloaded fonts there, everything works perfectly. I don't even use registerfonts.

Profile icon
vishal8909

Fontconfig error: Cannot load default config file

Profile icon
SixBeeps

Try making an explicit config file:
1.) Make a folder called fonts
2.) Put the font you want to use in that folder
3.) Make a file in the folder named fonts.conf and put this in it:

<?xml version="1.0"?> <!DOCTYPE fontconfig SYSTEM "fonts.dtd"> <fontconfig> <dir>/var/task/fonts/</dir> <cachedir>/tmp/fonts-cache/</cachedir> <config></config> </fontconfig>
Profile icon
CrisKop

@SixBeeps the error still

Profile icon
Bookie0

i dont know how to help you, but for others who can help you, you should include your repl or a link to it.