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

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

1. 本地生效的原因

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

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

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

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

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

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

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

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

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

相关推荐
夕水几秒前
ew-vue-component:Vue 3 动态组件渲染解决方案的使用介绍
前端·vue.js
Winwin2 分钟前
js基础-数据类型
javascript
Winwin3 分钟前
哈?Boolean能作为回调函数?
javascript
我麻烦大了4 分钟前
实现一个简单的Vue响应式
前端·vue.js
Shartin7 分钟前
CPT208-Human-Centric Computing: Prototype Design Optimization原型设计优化
开发语言·javascript·原型模式
独立开阀者_FwtCoder11 分钟前
你用 Cursor 写公司的代码安全吗?
前端·javascript·github
dme.19 分钟前
Javascript之DOM操作
开发语言·javascript·爬虫·python·ecmascript
Cacciatore->21 分钟前
React 基本介绍与项目创建
前端·react.js·arcgis
摸鱼仙人~23 分钟前
React Ref 指南:原理、实现与实践
前端·javascript·react.js
teeeeeeemo24 分钟前
回调函数 vs Promise vs async/await区别
开发语言·前端·javascript·笔记