Custom font is not showing on Electron + Vue App(自定义字体未在 Electron + Vue App 上显示)
问题描述
我正在使用 Vue + Electron 开发一个应用程序,我在使用自定义字体时遇到了问题.在 web 模式下运行应用程序时,与自定义字体一起使用的图标显示正常.但是当我使用 electron-builder 构建应用程序时,图标/自定义字体没有加载.
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 头标签中导入自定义字体,自定义字体位于 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.
任何帮助谢谢
推荐答案
要确保字体包含在电子中,请尝试以下操作:
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');
}
这应该确保你的字体被 webpack 包含在电子中.
This should make sure that your font is included with electron by webpack.
这篇关于自定义字体未在 Electron + Vue App 上显示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:自定义字体未在 Electron + Vue App 上显示
基础教程推荐
- Karma-Jasmine:如何正确监视 Modal? 2022-01-01
- 响应更改 div 大小保持纵横比 2022-01-01
- 有没有办法使用OpenLayers更改OpenStreetMap中某些要素 2022-09-06
- 动态更新多个选择框 2022-01-01
- 在for循环中使用setTimeout 2022-01-01
- 悬停时滑动输入并停留几秒钟 2022-01-01
- 在 JS 中获取客户端时区(不是 GMT 偏移量) 2022-01-01
- 我什么时候应该在导入时使用方括号 2022-01-01
- 角度Apollo设置WatchQuery结果为可用变量 2022-01-01
- 当用户滚动离开时如何暂停 youtube 嵌入 2022-01-01