vue项目引入字体文件过大和动态加载文本,字体不生效问题

vue项目引入字体文件过大和动态加载文本,字体不生效问题

一、引入的字体文件包太大1、字体打包前2、字体打包后图中看到字体文件都有8M多,这样直接引入字体文件,vue页面打包后会出现刚开始,页面字体是默认字体,等引入的字体加载后,页面字体会从默认字体转为使用的引入字体,这样,视觉上就会给用户不好的体验。二、如何压缩引入的打包字体1、这里可以使用字蛛font-spider来进行压缩npm install font-spider -g查看font-spider是否安装font-spider -V2、如何压缩对应字体1、对于静态页面来说,在font.css里引入对应的字体库文件上面2-45,2-55,2-75,2-85是对应的字体大小文件2、在htm...

前端 2024-03-09 PM 60℃ 0条
Flutter组件使用技巧(二)

Flutter组件使用技巧(二)

一、padding使用padding包裹控件,内边距,即本Widget边框和内容区之间距离// 1. 所有方向均使用相同数值的填充。 all(double value) // 示例:4个方向各添加16像素补白 padding: EdgeInsets.all(16.0) // 2. 分别指定四个方向的不同填充 fromLTRB(double left, double top, double right, double bottom) // 示例: padding: const EdgeInsets.fromLTRB(10,20,30,40) // 3. 设置具体某个方向的填充(可以同...

前端 2023-01-02 PM 375℃ 0条
js常用技术汇总

js常用技术汇总

获取当前日期的周一、周末的日期export function getWeeekdata(cdate){ //cdate 传来当前的时间 let now = new Date(cdate); let year = now.getFullYear(); let month = now.getMonth() + 1; let date = now.getDate(); let nowTime = now.getTime(); let day = now.getDay(); let oneDayTime = 24 * 60 * 60 * 1000; ...

前端,js知识 2022-10-23 PM 209℃ 0条
Flutter技巧

Flutter技巧

Row里面使用ListView时,页面不显示的原因是没有空间撑开 ListView的外层要加上Expanded 只能在Column,Row,Flex以及它们的子组件,这里指的是子组件而不是子结点,是指继承Column,Row,Flex的子组件。 Expanded的父结点必须是Column,Row,Flex以及它们的子组件,不能是Column->Container->Expanded(表示结点路径) 在使用Expanded时,如果在它的上层结点中有List类型的结点,比如SingleChildScrollView,或者ListTile等, 其滑动方向应该与Expanded填充方...

前端 2022-10-23 PM 170℃ 0条
vite+vue3+ts+pinia/vuex项目搭建

vite+vue3+ts+pinia/vuex项目搭建

1、首先npm init vite@latest 或者yarn create vite 再或者 pnpm create vite安装时选择vue+ts2、路由的创建与使用 vue3需要4.0版本的路由1)安装 npm i vue-router2)创建路由脚本:src目录下>创建router目录>index.ts编写:/src/router/index.ts import { createRouter, RouteRecordRaw, createWebHashHistory } from "vue-router"; import Home fr...

vue使用,前端 2022-07-17 PM 765℃ 0条