vue 项目如何引入其他字体在做大屏可视化项目中，会遇到平时很少使用的字体，且浏览器无法解析，比如：Digital Nu

以自己在项目中使用Digital Numbers字体为例

在大屏可视化项目中，一些数字使用了Digital Numbers字体，想当然认为在css中加入font-family：Digital Numbers; 结果页面并没有展示这种字体，反而报错：

1638932928(1).png

解决方法：

1.搜索Digital Numbers 并下载

2.解压下载包，把.ttf文件放到src/assets/font下

1638933149(1).png

1638933284(1).png

然后在使用的页面style里加入

@font-face {
  font-family: "Digital Numbers";
  src: url("~@/assets/font/sa-digital-number.woff.ttf");
}

在那个地方使用该字体，就可以直接font-family：Digital Numbers；（大功告成）

1638933432(1).png