問(wèn)題描述
我正在使用 Vue + Electron 開(kāi)發(fā)一個(gè)應(yīng)用程序，我在使用自定義字體時(shí)遇到了問(wèn)題.在 web 模式下運(yùn)行應(yīng)用程序時(shí)，與自定義字體一起使用的圖標(biāo)顯示正常.但是當(dāng)我使用 electron-builder 構(gòu)建應(yīng)用程序時(shí)，圖標(biāo)/自定義字體沒(méi)有加載.
I am developing an app using Vue + Electron and im facing an issue using custom fonts. When running the app in web mode, the icons used with the custom font show ok. But when i build the app using electron-builder, the icons/custom font are not loaded.
我在 index.html 頭標(biāo)簽中導(dǎo)入自定義字體，自定義字體位于 src/renderer/assets/fonts 文件夾中.
I import the custom font in the index.html head tag and the custom fonts are located in src/renderer/assets/fonts folder.
任何幫助謝謝
推薦答案
要確保字體包含在電子中，請(qǐng)嘗試以下操作:
To make sure that the font is included in electron, try something like this:
在您的渲染器 main.js 中
In your renderer main.js
import './scss/app.scss'
在你的'./scss/app.scss'中
In your './scss/app.scss'
@font-face {
font-family: 'Your Custom Font';
src: url('../assets/fonts/Your Custom Font.ttf');
}
這應(yīng)該確保你的字體被 webpack 包含在電子中.
This should make sure that your font is included with electron by webpack.
這篇關(guān)于自定義字體未在 Electron + Vue App 上顯示的文章就介紹到這了，希望我們推薦的答案對(duì)大家有所幫助，也希望大家多多支持html5模板網(wǎng)！