Vue中如何引入外部字体

 一、下载外部字体.ttf的文件

https://www.dafont.com/ 字体下载地址

 

 二、在src/assets/下新建font文件夹 ，将下载的字体包放入 

3、font下新建font.css，将字体包统一引入   

@font-face {
  font-family: "hjgakk";
  src: url('hjgakk.ttf');
  font-weight: normal;
  font-style: normal;
}

上面的font-family可以自定义去设置，设置什么，将来使用的时候就用什么 

4、 main.js全局引入 

import '@/assets/font/font.css';

5、项目中直接使用

.date {
  font-size: 35px;
  color: #2879ff;
  font-family: 'hjgakk';
} 

参考文章：https://blog.csdn.net/m0_51431448/article/details/125072682