前端vue引入特殊字体不生效

引入特殊字体ttf,TTF等发现开发环境中生效,项目部署后不生效何解?

1. 本地生效的原因

本地使用的是本地的资源,控制台可以看到对ttf文件的请求与加载。

2.部署后不生效的原因与解决

控制台可以看到对ttf资源文件的请求加载失败,code可能是200不代表返回成功了哦,注意仔细看响应

(1)检查引用的文件名是否大小写正确。比如文件后缀 ttf 和TTF

(2)检查项目是用什么构建的

①vite:默认情况下,使用环境的打包命令会看到所有的资源(img,css,js,fonts)都统一放在assets下(如果没有特殊配置的话);

②webpack:也需要查看对应的打包后的文件结构

(3)看nginx配置文件是否需要添加 字体路径到服务器上上的映射

(4)H5页面被嵌入的环境是否禁用了特殊字体

相关推荐
zh731434 分钟前
支付宝沙盒模式商家转账经常出现 响应异常: 解包错误
前端·阿里云·php
ZHOU_WUYI40 分钟前
用react实现一个简单的三页应用
前端·javascript·react.js
samroom1 小时前
Vue项目---懒加载的应用
前端·javascript·vue.js·性能优化
手机忘记时间1 小时前
在R语言中如何将列的名字改成别的
java·前端·python
苹果酱05672 小时前
[数据库之十一] 数据库索引之联合索引
java·vue.js·spring boot·mysql·课程设计
郝郝先生--2 小时前
Flutter 异步原理-Zone
前端·flutter
geovindu2 小时前
vue3: pdf.js5.2.133 using typescript
javascript·vue.js·typescript·pdf
花开花落的博客2 小时前
uniapp 不同路由之间的区别
前端·uni-app
whatever who cares3 小时前
React 中 useMemo 和 useEffect 的区别(计算与监听方面)
前端·javascript·react.js
老兵发新帖3 小时前
前端知识-hook
前端·react.js·前端框架