vant icon在内网使用问题处理

vant icon在内网时使用问题

Icon 组件默认引用有赞 CDN 提供的字体文件,并通过网络下载。如果需要在项目中使用本地字体文件,请引入下面的 CSS 文件,并在项目中配置 url-loader。
但是当在内网使用时会出现vant的字体请求不到的问题:
这时vant官网给出解决方案为
main.js中的引入css

import 'vant/lib/icon/local.css';

Tips: 从 2.10.13 版本开始,Vant 会默认使用 woff2 格式的本地字体文件,只有在不支持 woff2 字体的低端浏览器上才会加载有赞 CDN 的网络图标。
但是在有些内网环境的确会出现无法加载woff2的情况

但是在测试时有些情况下还是无法出现正常加载字体,所以采用将网络下载的字体下载下来
tff等

@font-face {
    font-family: 'vant-icon',
    url: loder(vant-icon) url(本地加载的地址.tff),
    url: loder(vant-icon) url(本地加载的地址.woff),
    url: loder(vant-icon) url(本地加载的地址.woff2)
}

将如上的方式引入之后就可以解决在某些环境vanticon无法使用的问题。

你可能感兴趣的:(vue.js)