有赞前端 UI框架「Vant」在离线无网络环境中使用 icon 无法显示的问题

第一次使用这个框架。UI组件中规中矩,很简洁,不是特别多,基本够用。Vant 官网

在内网中部署 Vue+Vant的项目时,发现所有的 icon 图标全部是小方块无法正常显示。查看网络请求,发现图标字体引用的在线文件。

查阅官方文档,发现可以使用本地字体文件
在这里插入图片描述
我自己使用的方法配置如下:
main.js中配置:

import Vant from 'vant';
import 'vant/lib/index.css';
import 'vant/lib/icon/local.css';
Vue.use(Vant);

然后在离线环境下就可以愉快地使用 icon 啦。

Logo

前往低代码交流专区

更多推荐