如何在React中使用iconify-json图标
前景提要iconify图表库涵盖了超多图片，是一个超级图标库官网地址开始安装依赖和你需要的图标集npm install @iconify/react @iconify/json npm install @iconify-json/mdi基础使用import React from 'react'; import { Icon } from '@iconify/react'; import mdiIc
Nuxt.js代码风格配置
因为 Nuxt 官方有自带的 Nuxt ESLint 模块，该模块使用扁平化配置，不再使用 extends，使每个eslint配置都独立可控，故此处不使用传统的代码风格配置。正文开始：第一步使用 npx nuxi module add eslint 命令快速添加 @nuxt/eslint 模块到项目中，运行此命令之后会自动生成 eslint.config.mjs 配置文件并且会自动在 nuxt.c
适用于React且支持渲染svg字符串的图标组件
svg图标可以直接从icones.js一键获取某个图标库的所有图标，并且有多种格式可以下载。为了方便拓展这里我们使用json格式。因为拓展图标只需要将svg字符串加到我们的json文件内，所以你的图标库理论上可以非常非常丰富。具体操作如下：找到自己喜欢的图标库之后，点击右上角的菜单按钮然后点击json就会自动下载一个包含该图标库的json文件，里面带有改图标库的所有的图标的svg字符串。接下来完善
NPM Binary 镜像配置
在 NPM 安装 Electron, Puppeteer 等包时，他们会通过 postinstall 脚本下载对应的二进制文件。因为一些不得而知的原因这个过程在某些网络下可能会很慢或不可用。你可以复制以下配置至 .bashrc 或 .zshrc 中，使用 npmmirror.com 提供的二进制镜像。数据来源于 binary-mirror-config。# === NPM BINARY CHINA
适用于Vue、React、Angular、Ts和Js毫秒级计时器，包括正、倒计时
由于定时器精准度问题，根据设备性能的影响误差会存在 0～20ms ，所以需要结合自身的使用场景来决定能不能使用。此处实现使用的是 setInterval 定时器加上 performance.now() 来校准 setInterval 的误差。以下例举出了适用于各个框架的版本，可根据需求自行修改。Vue版本import { reactive } from 'vue'; export interfa
你写的深度克隆真的“深度”吗？
深度克隆是前端开发中无法避免的话题，几乎每个前端开发者都遇到过这个话题，那我们就来看看你写的深度克隆真的正确吗？大家先看下面这段代码：/** * 我是最强的深度克隆 */ const deepClone = (obj: any) => { return JSON.parse(JSON.stringify(obj)) }平时开发中用这个方法或者过去用过这个方法去“深度克隆”的同学请
Android Studio下载Gradle超时解决方案
Android Studio找到项目中 gradle 配置文件的路径，我的路径为 /你的项目路径/gradle/wrapper/gradle-wrapper.properties，里面对应内容应该如下所示：#Tue Jun 11 16:15:13 CST 2024 distributionBase=GRADLE_USER_HOME distributionPath=wrapper/dists di
如何降低代码耦合度，提升代码质量？
降低代码耦合度有许多好处，主要包括以下几个方面：1. 提高代码的可维护性低耦合度使得代码更加模块化，每个模块或组件相对独立。这样，在修改或修复某个模块时，不会对其他模块造成影响。代码变得更容易理解和维护。2. 提高代码的可测试性低耦合度允许你为每个模块编写独立的单元测试。因为模块之间的依赖性减少，测试某个模块时，可以使用模拟（mock）或桩（stub）来替代实际的依赖，这样测试就更加简单和有效。3
如何利用浏览器资源提示关键词优化网页性能
浏览器资源提示关键词在现代Web开发中，页面加载速度对用户体验至关重要。浏览器提供了一些资源提示关键词（Resource Hints），帮助开发者优化页面加载速度。这些关键词包括 defer、async、preload、prefetch、dns-prefetch、prerender 和 preconnect。合理利用这些关键词，可以显著提高页面加载性能，优化用户体验。1. defer 和 asyn
Vue3中组件使用ref时获取组件类型推导
我们在使用Vue3+ts开发时，常常会用到一些第三方组件库，比如Element-Plus UI、Navie UI等，这些UI框架中有些组件常常会暴露一些方法给我们便捷的去实现各种复杂的交互，我们经常会像下面这样去给组件定义一个ref去获取组件的实例：<template> <div> <el-drawer ref="drawerRef"