Vue中怎么引入字体包

创建文件并添加字体包

路径示例：

├── src
│   ├── assets // 资源文件夹
│   │    └── font // 存放字体文件夹
│   │        ├── 字体.ttf // 字体文件
│   │        └── font.css // 字体引入
...

font.css文件内容：

css

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

TIP

如果需要引入多个字体，直接在此继续添加即可，不用再另建文件

javascript

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

在需要用到字体的 class 中，用 font-family 引入即可

css

font-family: 'YouSheBiaoTiHei-2';