- 博客(193)
- 问答 (3)
- 收藏
- 关注
RSS订阅原创 原生JavaScript获取元素的padding内边距
方法返回一个对象，该对象在应用活动样式表并解析这些值可能包含的任何基本计算后报告元素的所有 CSS 属性的值。私有的 CSS 属性值可以通过对象提供的 API 或通过简单地使用 CSS 属性名称进行索引来访问。返回用 index 标记的属性名，当 index 越界时返回空字符串。另一个可选方案：使用 nodeList[]（在 i 越界时返回 undefined）获取。在 CSS 声明块中修改现有属性或设置新属性。当前声明块的文本内容。返回可选的优先级，"important"。从 CSS 声明块中删除属性。
2024-03-04 15:02:17
488
原创 vite 样式按需加载
以上两个插件可以实现按需引入组件库样式，尝试后发现vite-plugin-imp这个插件目前有个问题是，它支持按照组件动态引入组件内部的样式，但是antd还定义了一些全局样式，比如对a标签的样式重写，这部分样式没有被正确引入。所以我建议使用vite-plugin-style-import。若是启动报错：consola没有需要安装。用于按需引入组件库样式的插件。
2023-11-16 16:52:25
271
原创 React.memo使用报错Component definition is missing display name
函数组件使用React.memo对其进行优化时，Eslint校验报错：Component definition is missing display。1、添加 TestCom.displayName = 'TestCom'原因：直接导出箭头函数不会给组件一个displayName。2、导出一个常规函数，函数名为displayName。
2023-11-09 18:50:42
491
原创 vite 关于 global is not defined 问题
原因：Vite 是 ESM 机制，有些包内部使用了 node 的 global 对象。问题：在使用第三方包的时候也报错：global is not defined。
2023-11-09 18:38:30
1084
转载 2023年前端主流技术趋势
node从7，8年前的爆火，到现在的不温不火，前端语言介入服务端这个命题似乎现在是越来越清晰了。同时对于单个CI的构建步骤，解决每台机器，每个人都要单独构建的问题，还提炼了类似store的方案，脱离了构建环境，只跟项目绑定，当然这个方案是否使用要看你自己，毕竟原理是把构建产物放到第三方储存，而第三方又不是一个类似npm的开源机构。最先说的肯定是AI，22年末，23年初的chatgpt让AI话题火的一塌糊涂，同时也被认为是一次重大的技术革新，技术革新带来的就是重塑，一切都要被重塑，你的职业，你的工作。
2023-08-17 10:15:25
312
1原创 webpack中hash、chunkhash、contenthash区别
webpack中hash、chunkhash、contenthash区别
2023-02-08 21:26:23
526
原创 warning: adding embedded git repository: 仓库名
warning: adding embedded git repository: 仓库名
2023-02-06 22:41:14
2149
原创 charles抓包配置及解决抓包没有网
1、安装2、配置证书安装：Help -> SSL Proxying -> Install Charles Root Certificate，mac需要配置证书注意点击安装证书–>下一步后，选择（将所有证书放入下列存储），确定选择（受信任的根证书办法机构），确定后点击下一步–>（用户选定的证书存储）点击完成；移动端安装证书：浏览器中输入chls.pro/ssl来安装证书，若手机是iphone，需要设置：设置-> 通用 -> 关于本机 ...
2022-03-15 16:14:25
8270
原创 如何优化代码中大量的if/else，switch/case?
代码中如果if-else比较多，阅读起来比较困难，维护起来也比较困难。不会把if-else重构成高质量代码的程序员，不是个优秀的程序员。要明确一点，不是所有的if/else,switch/case都需要优化，当我们发现有“痛点”或者“闻到代码有坏味道”再来优化才是最好的，不然你可能会写了一个从不扩展的可扩展代码，所有的优化都是为了更好的迭代项目，更好的服务于业务，而不是为了优化而优化。1、枚举或者构建数组取值，来避免大量if/else和switch/case如要获取今天是星期几？func.
2022-02-14 18:50:06
2574
原创 前端代码检测重复率工具
不断的迭代更新，项目中不可避免的会出现一些重复的代码，这可能是CTRL C + CTRL V造成的，也有可能是因为不同的项目成员重复造轮子造成的。为了保证项目代码的质量，应尽早对项目进行代码重复率的管控。一般的重复代码有一下几类：完全一致的代码或者只修改了空格和评论 结构上和句法上一致的代码，例如只是修改了变量名 插入和删除了部分代码 功能和逻辑上一致的代码，语义上的拷贝在技术上，重复代码检测主要有以下分类：基于代码行的 基于标识符（token）的 基于度量（metrics）的 基
2022-02-11 15:46:00
3498
转载 热门NPM库 “coa” 和“rc” 接连遭劫持，影响全球的 React 管道
聚焦源代码安全，网罗国内外最新资讯！编译：代码卫士专栏·供应链安全数字化时代，软件无处不在。软件如同社会中的“虚拟人”，已经成为支撑社会正常运转的最基本元素之一，软件的安全性问题也正在成为当今社会的根本性、基础性问题。随着软件产业的快速发展，软件供应链也越发复杂多元，复杂的软件供应链会引入一系列的安全问题，导致信息系统的整体安全防护难度越来越大。近年来，针对软件供应链的安全攻击事件一直呈快速增长态势，造成的危害也越来越严重。为此，我们推出“供应链安全”栏目。本栏目汇聚供应链安全资讯.
2021-11-17 17:13:12
543
原创 Cannot find module coa/compile.js
热门NPM库 “coa”遭劫持，影响全球的 React 管道，解决有coa劫持引起的安装项目报错。
2021-11-17 17:09:29
1811
原创 WebViewJavascriptBridge
Web 页面中的 JS 与 iOS Native 如何交互？JS 和 iOS Native 就好比两块没有交集的大陆，如果想要使它们相互通信就必须要建立一座“桥梁”。WebViewJavascriptBridge是盛名已久的 JSBridge 库，它仅使用了少量代码就实现了对于 Mac OS X 的 WebView 以及 iOS 平台的 UIWebView 和 WKWebView 三种组件的完美支持。WebViewJavascriptBridge 主要是作为 Mac OS X 和 iOS 端（Na.
2021-11-15 11:36:57
6146
原创 判断浏览器是否支持WebP格式的图片
support-webp.tsexport default new Promise(resolve => { const image = new Image(); image.onerror = () => resolve(false); image.onload = () => resolve(image.width === 1); image.src = 'data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASo
2021-11-12 16:41:12
1199
原创 inquirer.js —— 一个用户与命令行交互的工具
开始通过npm init 创建package.json的时候就有大量与用户的交互(当然也可以通过参数来忽略输入)；而现在大多数工程都是通过脚手架来创建的，使用脚手架的时候最明显的就是与命令行的交互，如果想自己做一个脚手架或者在某些时候要与用户进行交互，这个时候就不得不提到inquirer.js了。介绍由于交互的问题种类不同，inquirer为每个问题提供很多参数：type：表示提问的类型，包括：input, confirm, list, rawlist, expand, checkbox, pas
2021-11-11 15:31:40
371
原创 react项目中使用lodash的debounce
react中使用lodash的debounce，使用如下： constructor(props: Props) { super(props); this.state = { value: "", }; this.handleChange = this.handleChange.bind(this); this.debounceInput = _.debounce(this.debounceInput, 500); } handleCha.
2021-09-15 17:14:19
2721
原创 坐标系转换
最近在做一个活动，涉及多环境的定位，如app、微信、支付宝小程序等，分别采用各自环境的定位api获取用户当前位置的经纬度，根据经纬度获取距离该用户最近的门店。app(本公司)采用的百度坐标系（BD09，百度坐标） 微信采用的腾讯坐标系（WGS84，gps定位） 支付宝采用高德坐标系（火星坐标系）不同坐标系参照物不一样，之间存在误差 ，需要统一坐标系获取最近的门店，是根据经纬度计算最短距离。该接口采用的是百度坐标系，所以使用上面定位到的经纬度需要统一转换成百度坐标系，百度提供了坐标转换接口，微信
2021-09-15 16:33:23
496
原创 .html页面缓存问题
一般项目发版后前端静态文件会有缓存问题，不强制刷新很难解决，但是用户不会去强制刷新。一般浏览器缓存的文件有html、css、js等。而html中引入的css和js的名字都加了哈希值，所以新版本css、js和就旧版本的名字是不同的，不会有缓存问题。但是浏览器把整个html页面缓存就稍微麻烦些。html静态文件缓存：1、一般设置了静态文件的缓存，都会设置文件的协商缓存。所以每次请求下载文件时，都会返回一个http响应Last-Modified:文件修改时间1。用户访问文件会在http请求头带上If-
2021-09-15 15:02:00
7750
git reset --hard删除commit内容 把本地的文件都删除了 怎么恢复
2019-03-15
标签上直接添加onclick事件和jq绑定onclick事件有什么区别
2018-06-25
php mongodb 可以批量更新同一字段为不同值？
2018-04-12
TA创建的收藏夹 TA关注的收藏夹
TA关注的人