when I deployed my app of the nextjs (nextjs 15 rc) on the vercel, but found the error like this , Fontconfig error: Cannot load default config file
,percheck , it wasn’t caused by my code and it seems that it was caused by the server of the Vercel lacked of the fontconfig
,could your team please help install the fontconfig
or do any favor?
Hi, @bertramye! Welcome to the Vercel Community
It’s important to note that Vercel typically provides a complete environment for running Next.js applications, including necessary system libraries like Fontconfig. The error you’re seeing is unusual and might be related to a specific configuration in your project or a temporary issue with the deployment.
Here are some steps you can take to troubleshoot and potentially resolve the issue:
- Do you have any more detailed logs that could provide any clues? Look for any warnings or errors related to font configuration or library loading.
- Can you make sure your
next.config.js
file doesn’t have any unusual settings that might affect font loading or system libraries? - It’s worth reviewing your
package.json
file to ensure you’re not using any packages that require additional system libraries for font handling. - Since you’re using Next.js 15 RC, there might be some instability. Consider using the latest stable version of Next.js for your production deployments - this could help us rule this out.
Let us know how you get on!
hello @pawlean , here are below my package.json
files
{
"name": "blog",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev --turbo",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@types/bcrypt": "^5.0.2",
"@types/grecaptcha": "^3.0.9",
"@types/nodemailer": "^6.4.15",
"babel-plugin-react-compiler": "^0.0.0-experimental-52d6685-20240815",
"bcrypt": "^5.1.1",
"canvas": "^2.11.2",
"highlight.js": "^11.10.0",
"ioredis": "^5.4.1",
"mongoose": "^8.5.3",
"next": "^15.0.0-rc.0",
"next-auth": "^5.0.0-beta.18",
"next-mdx-remote": "^5.0.0",
"nodemailer": "^6.9.14",
"react": "^19.0.0-rc-1eaccd82-20240816",
"react-dom": "^19.0.0-rc-1eaccd82-20240816",
"rehype-autolink-headings": "^7.1.0",
"remark-gfm": "^4.0.0",
"remark-toc": "^9.0.0",
"TagCloud": "^2.5.0",
"zustand": "^4.5.5"
},
"devDependencies": {
"@types/node": "^20",
"@types/react": "^18",
"@types/react-dom": "^18",
"eslint": "^8",
"eslint-config-next": "15.0.0-rc.0",
"postcss": "^8",
"tailwindcss": "^3.4.1",
"typescript": "^5"
}
}
and per check , there shouldn’t have the lib impact the system, and in the code , I just use the code here below to import the fonts I want, and it works for me, which shouldn’t impact the system fonts,
import CanvasBuilder from 'canvas'; // import the node-canvas to do some of the draw actions
.......
const canvas= CanvasBuilder.createCanvas(width, height);
// this fonts here below existed and path is correct
const fontPath = path.join(process.cwd(), 'public/fonts/HostGrotesk-VariableFont_wght.ttf')
CanvasBuilder.registerFont(fontPath, { family: 'CustomFont' }); // import the fonts
const ctx = canvas.getContext('2d');
ctx.font = `10px CustomFont,sans-serif,serif`; // use the fonts
.........
and also there are some similar reference, may can do you a favor for these issue checking : 14.04 - Fontconfig error: cannot load default config file - Ask Ubuntu
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.