解决uniapp静态文件字体包太大打包大小超出限制

一、解决uniapp静态文件字体包太大打包大小超出限制

1.在app.vue文件下使用本地文件修改为网络路径

文件大小超过20m可以使用cdn加速我使用unicloud(示例):

<style lang='scss'>
	/* 全局引入思源黑体 */
	/* @import url('@/common/SourceHanSansCN/SourceHanSansCN.css'); */
	/* 路径为测试路径不能打开 */
	@import url('https://7463-tcb-reu231rfsoklfql25373e40-8cac7c-1304419594.tcb.qcloud.la/字体包/SourceHanSansCN.css');
</style>

2.修改css里面的字体路径

	@font-face{
		font-family: "Bold";
		/* src: url('~@/common/SourceHanSansCN/SourceHanSansCN-Bold.otf')format('opentype'); */
		src: url('https://7463-tcb-reu231roklfql25373e40-8cac7c-1304419594.tcb.qcloud.la/字体包/SourceHanSansCN-Bold.otf')format('opentype');
		/* font-weight: normal;
		 font-style: normal; */
	}
	@font-face{
		font-family: "ExtraLigh";
		/* src: url('~@/common/SourceHanSansCN/SourceHanSansCN-ExtraLight.otf')format('opentype'); */
		src: url('https://7463-tcbre-reu231roklfql25373e40-8cac7c-1304419594.tcb.qcloud.la/字体包/SourceHanSansCN-ExtraLight.otf')format('opentype');
		 font-weight: normal;
		 font-style: normal;
	}
	@font-face{
		font-family: "Light";
		/* src: url('~@/common/SourceHanSansCN/SourceHanSansCN-Light.otf')format('opentype'); */
		src: url('https://7463-tcb-reufd231roklfql25373e40-8cac7c-1304419594.tcb.qcloud.la/字体包/SourceHanSansCN-Light.otf')format('opentype');
		 font-weight: normal;
		 font-style: normal;
	}
	@font-face{
		font-family: "Medium";
		/* src: url('~@/common/SourceHanSansCN/SourceHanSansCN-Medium.otf')format('opentype'); */
		src: url('https://7463-tcb-reu231fdsroklfql25373e40-8cac7c-1304419594.tcb.qcloud.la/字体包/SourceHanSansCN-Medium.otf')format('opentype');
		 font-weight: normal;
		 font-style: normal;
	}
	@font-face{
		font-family: "Normal";
		/* src: url('~@/common/SourceHanSansCN/SourceHanSansCN-Normal.otf')format('opentype'); */
		src: url('https://7463-tcb-reu2fds31roklfql25373e40-8cac7c-1304419594.tcb.qcloud.la/字体包/SourceHanSansCN-Normal.otf')format('opentype');
		 font-weight: normal;
		 font-style: normal;
	}
	@font-face{
		font-family: "Heavy";
		/* src: url('~@/common/SourceHanSansCN/SourceHanSansCN-Heavy.otf')format('opentype'); */
		src: url('https://7463-tcb-reu231rfdsoklfql25373e40-8cac7c-1304419594.tcb.qcloud.la/字体包/SourceHanSansCN-Heavy.otf')format('opentype');
		 font-weight: normal;
		 font-style: normal;
	}
	@font-face{
		font-family: "Regular";
		/* src: url('~@/common/SourceHanSansCN/SourceHanSansCN-Regular.otf')format('opentype'); */
		src: url('https://7463-tcb-reu231rofdsklfql25373e40-8cac7c-1304419594.tcb.qcloud.la/字体包/SourceHanSansCN-Regular.otf')format('opentype');
		 font-weight: normal;
		 font-style: normal;
	}
	@font-face{
		font-family: "ZhenyanRegular";
		/* src: url('@/common/SourceHanSansCN/ZhenyanGB-Regular.ttf'); */
		src: url('https://7463-tcb-reu231rfdsoklfql25373e40-8cac7c-1304419594.tcb.qcloud.la/字体包/ZhenyanGB-Regular.ttf');
		 font-weight: normal;
		 font-style: normal;
	}

大功告成
在这里插入图片描述

文件储存默认可以使用uni-app提供的uniCloud云存储使用完全免费。


你可能感兴趣的:(uni-app,前端)