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

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

1. 本地生效的原因

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

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

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

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

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

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

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

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

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

相关推荐
天宇&嘘月2 小时前
web第三次作业
前端·javascript·css
小王不会写code2 小时前
axios
前端·javascript·axios
发呆的薇薇°3 小时前
vue3 配置@根路径
前端·vue.js
luoluoal3 小时前
基于Spring Boot+Vue的宠物服务管理系统(源码+文档)
vue.js·spring boot·宠物
luckyext4 小时前
HBuilderX中,VUE生成随机数字,vue调用随机数函数
前端·javascript·vue.js·微信小程序·小程序
小小码农(找工作版)4 小时前
JavaScript 前端面试 4(作用域链、this)
前端·javascript·面试
前端没钱4 小时前
前端需要学习 Docker 吗?
前端·学习·docker
前端郭德纲4 小时前
前端自动化部署的极简方案
运维·前端·自动化
海绵宝宝_4 小时前
【HarmonyOS NEXT】获取正式应用签名证书的签名信息
android·前端·华为·harmonyos·鸿蒙·鸿蒙应用开发
码农土豆5 小时前
chrome V3插件开发,调用 chrome.action.setIcon,提示路径找不到
前端·chrome