vue-cli3引入第三方字体文件

1. 在src目录下新建font目录，并创建font.css文件，并将字体文件放进该目录

文件：font.css:

@font-face {  
    font-family: 'BEBA';
    src: url('BEBA.ttf');
}

2. 在项目中引入，比如在APP.vue中引入，在子页面Index.vue中使用

文件：APP.vue

<template>
  <div id="app">
    <router-link to="/Index">首页</router-link>
    <router-view></router-view>
  </div>
</template>
 
<script>
export default {
}
</script>
 
<style lang="less">
@import "./font/font.css";
</style>

文件：Index.vue

<template>
    <div>
           首页
        <div class="tst">01</div>
    </div>
</template>
<style lang="less" scoped>
.tst{
    font-family: BEBA;
}
</style>

原文链接：https://blog.csdn.net/weixin_36185028/article/details/103455554