VUE3外部字体导入

1.先下载外部字体，链接：iconfont-阿里巴巴矢量图标库

---

2.将下载好的字体解压到项目的assets文件下

这里创建了iconfont文件夹来保存

---

3.创建一个样式font.scss

font.scss:

@font-face {
  font-family: 'SmileySans-Oblique';
  src:
    url('../iconfont/SmileySans-Oblique.otf') format('otf'),
    url('../iconfont/SmileySans-Oblique.ttf') format('ttf'),
    url('../iconfont/SmileySans-Oblique.woff') format('woff'),
    url('../iconfont/SmileySans-Oblique.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

body {
  font-family: 'SmileySans-Oblique';
}

---

4.最后在main.ts中引用

main.ts：

---

附上效果图：

---

OVER