摘要：
场景 在一般的网页开发过程中，往往我们都要下载较多的切图，而这些切图未必都做了压缩，即使做了压缩，效果未必能达到理想效果。 要解决这种图片压缩问题，途径有很多 1. 手动将图片丢到xx站点，压缩好之后再放进项目 2. 让UI给已经压缩好的图 这些方式都得靠人工操作，人工操作往往存在一些不确定性，比如 阅读全文
摘要：
背景介绍 目前有个项目，页面已上百，突然说要做国际化，懵了，页面这么多，那不得累滩，之前接触过的国际化是 react-intl，原理：每个国家的语言维护一份js字典，字典里有很多key，都是唯一，使用时通过读取这个key就能拿到对应国家的语言文本内容 例如 import { IntlProvider 阅读全文
摘要：
业务场景介绍 点击浏览器右上角已安装的chrome插件图标，这个时候会出现一个界面，我们称这个界面为popup，界面上有个"从页面获取产品信息"按钮，单机它会对当前标签页面内容进行截图，最后将截图的图片转成base64发送至xx接口 部分核心代码解读：截取当前可视区域的图片，为了能够截图足够多信息， 阅读全文
摘要：
先说下前端发版流程 1. 前端打包输出产物 /dist 文件 2. 删除远程服务下打包的旧代码 3. 将打包参物 /dist 文件 copy 到远程服务器目录 4. 重启服务器 问题1 在步骤2，3，4中用户访问目标服务器会报JS错误，正常情况打开网页的控制面板会看下报错信息 `Failed to 阅读全文
摘要：
/** 文件识别 */ export const getFileType = (fileName: string) => { if (!fileName) return 'other'; //根据文件名提取后缀名 const index = fileName.lastIndexOf('.'); co 阅读全文
摘要：
IP地址根据服务接口获取，获取完之后存入本地，之后一直在本地拿，本地存储没有情况下再向服务器获取 工具函数 最后在进入页面时调用，然后将IP绑定到window上，window.ip /** 获取本地Ip */ export const getLocalIp = async () => { const 阅读全文
摘要：
场景 在一个动态菜单场景中，你向接口获取树形菜单，但最后拿到的树未能达到你的预期，这个时候就需要手写递归重新处理这颗树 适用于react、vue菜单格式化工具函数 包含功能 1. 当前路由是否存在返回按钮 判断逻辑：只要存在左侧可点击的菜单都不具备返回按钮，其他则具有返回按钮 2. 错误路由过滤提醒 阅读全文
摘要：
场景 在一个多人开发的项目中经常会有文件提交的需求，但是有时候在提交图片时往往不压缩就提交上去了， 这个时候如果我们要约束其他人不能提交超过500k的图片，可以利用husky.js实现文件拦截 1.安装 Husky： 确保你已经在项目中安装了 Husky。如果还没有安装，可以使用以下命令： npm 阅读全文
摘要：
截图原理： 文件上传，将视频绘制到canvas中进行截图 贴代码 base64 转成文件 下面需要用到 export const dataURLtoFile = ({ dataURL = "", filename = "" }: { dataURL: string filename: string 阅读全文
摘要：
场景描述 产品要求开发一个落地页，为了美观，他要求这个两个页面分开设计，PC页面路由是`/landingpage`，移动端页面是`/landingpage/mobile` 从用户角度出发，现在有一种访问场景，假如用户A正在访问PC页面`/landingpage`，然后他要把这个页面以微信方式分享给用 阅读全文