首页 > 其他 > 详细

vue 中引入pingfang字体 或者其他字体 支持ttf otf格式

时间:2020-05-20 20:50:51      阅读:234      评论:0      收藏:0      [点我收藏+]

技术分享图片

 

 新建一个font 文件 里面放字体文件 可以百度搜索你想要的字体下载下来 一般10m左右

新建一个font.css 里面配置字体

@font-face {
    font-family: ‘PF‘;
    src: url(‘mud.TTF‘);
    font-weight: normal;
    font-style: normal;
  }
然后在需要使用的文件中导入该css 
技术分享图片

 

 我是在app.vue 全局导入 设置font-family:PF

在vue 脚手架4.0以上 需要在config.js 配置

//ttf字体解析
    rules: [
        {
            test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
            loader: ‘url-loader‘,
            options: {
                limit: 10000,
                name: utils.assetsPath(‘fonts/[name].[hash:7].[ext]‘)
            }
        }
    ]

vue 中引入pingfang字体 或者其他字体 支持ttf otf格式

原文:https://www.cnblogs.com/jackie-song/p/12925617.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!