关于vue-cli结合mui打包时所遇到的ttf 文件以及svg报错等问题

  1. 关于svg引入报错问题,因为webpack识别svg引入的时候需要双引号 所以在mui.css里需要找到这个class: mui-spinner:after 把background-image里面的url引入单引号改成双引号如下图
    在这里插入图片描述
    别以为完了 在这个class 下面还有个class mui-spinner-white:after 如下图
    在这里插入图片描述
    点开url里面的把单引号改成双引号
    在这里插入图片描述
    如果是引入的mui.min.css 找到 mui-spinner和mui-spinner-white:after 这两处的background-image把里面的单引号改成双引号即可

在这里插入图片描述

  1. 关于dev的时候引入mui的tff字体文件正常显示 而打包的时候放在服务器或者手机app上运行的时候不显示的问题,经过多方面查找发现是因为tff文件打包的时候路径问题所导致,需要找到webpack.base.conf.js 文件把之前的默认的处理tff文件的中的tff删掉,新增一条:{ test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, use: 'url-loader' },

在这里插入图片描述
另一篇关于怎么引入mui.js 的方式在我的另一篇博文
https://blog.csdn.net/weixin_40043172/article/details/88396037

整理不易,请给个赞,谢谢~~~~

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值