用Taro写一个微信小程序——引入外部字体
小程序直接用.ttf字体文件,在开发工具看没有问题,但是打包编译会提示这个字体文件打包上传不成功。
一、字体文件转换为css
1、打开https://transfonter.org/
注意选择Base64 encode,Formats选择TTF

2、点击Add fonts按钮,上传字体ttf文件

3、点击Convert按钮进行字体转换

4、点击下载按钮,得到如下文件

二、使用字体
1、将下载回来的css文件放入项目,在根目录的app.scss文件中引入

@import "styles/font/bebas.css";
2、在需要的位置直接使用
font-family: 'Bebas';
End-------------------------
Ten thousand sticky dreams
一万个粘稠的梦
lost to reality
敌不过一个现实
seer steals thief's cigarette
先知偷走盗贼的烟
and takes a puff
吞云吐雾
用Taro写一个微信小程序——引入外部字体的更多相关文章
- 用Taro写一个微信小程序(一)——开始一个项目
一.Taro简介 1.名字由来 Taro['tɑ:roʊ],泰罗·奥特曼,宇宙警备队总教官,实力最强的奥特曼. 2.taro是什么 Taro 是一个开放式跨端跨框架解决方案,支持使用 React/Vu ...
- 微信小程序引入外部字体(字体图标过大,引入外链)
1.把字体放在服务器上,因为字体图标比较大,小程序只支持2m 2.字体加载 3.检测是否加载成功(可能会存在https和http问题,防止跨域)
- 用Taro写一个微信小程序(二)——配置目录别名
配置别名可以方便书写代码引用路径,让代码更整洁. 官方文档可参考https://nervjs.github.io/taro/docs/config-detail#alias 一.在config/ind ...
- 用Taro写一个微信小程序(三)—— 配置dva
一.关于dva dva 首先是一个基于 redux 和 redux-saga 的数据流方案,然后为了简化开发体验,dva 还额外内置了 react-router 和 fetch,所以也可以理解为一个轻 ...
- 微信小程序——手把手教你写一个微信小程序
前言 微信小程序年前的跳一跳确实是火了一把,然后呢一直没有时间去实践项目,一直想搞但是工作上不需要所以,嗯嗯嗯嗯嗯emmmmm..... 需求 小程序语音识别,全景图片观看,登录授权,获取个人基本信息 ...
- 微信小程序引入外部组件 iView Weapp
iview Weapp组件的使用方法: 1. 下载小程序组件库 (前提是你已经有了项目目录) 你可以直接去github把iView Weapp的代码下载下来,也可以用过npm来下载. github地址 ...
- 微信小程序引入外部js 方法
步骤: 1.首先将外部js放在你指定的文件夹里(这都是废话...) 2.接下来 将该js文件中你要使用的方法给暴露出来 3.在您要使用的js中引入该js 4.使用暴露出来的方法 例子:使用md5加密 ...
- uni/微信小程序 - 使用外部字体
字体图标/字体仅支持网络css路径(也就是不支持本地路径) 参考于:https://blog.csdn.net/u013451157/article/details/79825740
- 如何快速地开发一个微信小程序
如何快速地开发一个微信小程序呢?我觉得作为初学者,最好能有一个模板,然后改这个模板. 同样作为初学者,刚开始的时候我有下面的几个问题,后来通过问同学,我弄清楚了. 微信小程序可以连接MySQL或者Sq ...
- 微信小程序引入md5.js
今天给大家安利一下微信小程序引入md5.js的方法,不多说 md5.js在下面 直接复制到项目的utils/md5.js即可 /* * A JavaScript implementation of t ...
随机推荐
- [转帖]文件操作之zip、bzip2、gzip、tar命令
文件操作之zip.bzip2.gzip.tar命令 原创 丁同学19902015-10-15 00:02:51博主文章分类:liunx基础著作权 文章标签linux tarlinux文件压缩linux ...
- [转帖]编译安装goofys挂载Scaleway免费75G对象存储
日常•2022年5月29日 goofys编译 goofys是一个开源的使用Go编写的s3存储桶挂载工具,主打高性能.由于使用Go编写,没有用到什么特别的依赖,自己编译也很容易.截止2022.5.2 ...
- [转帖]Kubernetes-17:Kubernets包管理工具—>Helm介绍与使用
https://www.cnblogs.com/v-fan/p/13949025.html Kubernets包管理工具->Helm 什么是Helm? 我们都知道,Linux系统各发行版都有自己 ...
- [转帖]sqlserver on linux vs windows
简单对比下sqlserver on windows与linux的特点,发现新的继续添加 对比项 sqlserver on windows sqlserver on Linux 备注 费用 需要wind ...
- SPEC2006的学习与总结
SPEC2006的学习与总结 摘要 最近特别想进行一些性能验证工作. 所以研究了spec2006 然后想整理一下之前的内容. 想着将内容整理一下. 这次主要是抄别人的. 知识来源: https://b ...
- Intel 的家用CPU的后缀
Intel 也奸商 各种后缀 最开始P 表示无核显版本 现在用 F来表示了.. 略坑. 一下来源百家号: https://baijiahao.baidu.com/s?id=16276964705166 ...
- 最佳实践:基于vite3的monorepo前端工程搭建
一.技术栈选择 1.代码库管理方式-Monorepo: 将多个项目存放在同一个代码库中 选择理由1:多个应用(可以按业务线产品粒度划分)在同一个repo管理,便于统一管理代码规范.共享工作流 选择理由 ...
- 【K哥爬虫普法】字节前高管,离职后入侵今日头条数据库,是阴谋、还是利诱?
案情介绍 2016年至2017年间,张洪禹.宋某.侯明强作为被告单位上海晟品网络科技有限公司主管人员,在上海市共谋采用技术手段抓取北京字节跳动网络技术有限公司(办公地点位于本市海淀区北三环西路43号中 ...
- [postgres]配置主从异步流复制
前言 环境信息 IP 角色 操作系统 PostgreSQL版本 192.168.1.112 主库 Debian 12 15.3 192.168.1.113 从库 Debian 12 15.3 配置主从 ...
- 小白学k8s(3)什么是内网穿透
什么是内网穿透 内网穿透 工作方式 通信的一方处于内网 通信的双方都处于内网 NAT穿透的原理 UDP内网穿透的实现流程 参考 什么是内网穿透 内网穿透 什么是内网穿透呢? 百度百科的描述 内网穿透, ...