- 博客(479)
- 问答 (8)
- 收藏
- 关注
原创 Taro 小程序开发注意事项(不定期记录更新)
本文总结了Taro开发中常见问题的解决方案:1)Webpack编译慢可通过配置优化;2)图片auto尺寸需使用mode属性;3)推荐使用Taro 3.6.39稳定版,4.x版存在兼容性问题;4)小程序启动时添加--clear参数可清除缓存;5)删除project.private.config.json文件可解决自动刷新问题。这些方案涵盖了编译、UI、版本选择和小程序调试等多个开发环节的典型问题。
2026-03-08 20:09:19
371
原创 Taro Webpack 5 编译过慢的解决方案
本文介绍了优化Taro Webpack编译速度的配置方案,核心提速措施包括:1)开启持久化缓存(cache.enable)提速80%+;2)关闭预打包(prebundle.enable)减少额外编译;3)缩小文件监听范围;4)缩短CSS哈希长度。通过保留必要配置(别名、插件)并去除冗余项,实测编译时间从6秒降至1秒内。适用于React框架的Taro小程序开发项目,特别适合小型项目优化编译效率。
2026-03-08 19:54:15
83
原创 SpringCache 缓存使用总结
摘要:本文分享了在SpringBoot 3.x中解决缓存问题的实践方案。由于JetCache对SpringBoot 3.x支持不完善,特别是@Cached注解的变量key失效问题,作者最终采用SpringCache作为替代方案。文章提供了两种实现方式:1)纯本地缓存(Caffeine)方案,包含完整依赖配置、缓存管理类和增删改查示例;2)本地+Redis混合缓存方案,包含相关配置和混合缓存管理实现。两种方案都详细说明了注解参数含义和使用场景,为开发者提供了在SpringBoot 3.x环境下完整的缓存解决方
2026-02-22 13:44:59
538
原创 SpringCloud 多模块下引入独立bom模块的正确架构方案
本文介绍了一个基于Maven的微服务项目依赖管理架构。项目采用多模块结构,包含服务模块(auth-service/gateway/iam-service)和共享模块(common/core/jwt)。核心是通过全局BOM(config/bom)统一管理所有依赖版本,包括Spring Boot(3.5.9)、Spring Cloud(2023.0.5)等框架版本以及常用工具库。根项目继承全局BOM并管理子模块,各微服务只需声明依赖无需指定版本。这种架构实现了依赖版本的集中控制,确保依赖一致性,同时简化了子模块
2026-02-20 15:29:39
152
原创 Zod 常用案例总结
Zod 极简教程摘要 Zod 是一个 TypeScript 优先的运行时数据校验库,核心功能包括数据校验和自动推导 TS 类型。本教程包含: 基础入门: 单个基础类型校验(字符串、数字、布尔值) 添加修饰符(长度限制、范围、默认值) 核心实战场景: 对象校验(表单/接口数据) 自定义规则(如密码一致性校验) 数组和联合类型处理 React 整合: 完整表单校验实现方案 自动推导表单类型 错误处理与状态管理 教程提供可直接运行的代码示例,覆盖90%常见需求,适合零基础快速上手。
2026-02-12 13:54:24
399
原创 Spring Security 6.x 常用功能的案例总结
本文介绍了Spring Security的核心实现与配置方法。主要内容包括:1. 极简实现案例,通过添加starter-security依赖快速集成,演示默认登录页和密码加密配置;2. 自定义登录逻辑,实现UserDetailsService接口完成用户认证,使用BCryptPasswordEncoder进行密码加密;3. 前后端分离配置,自定义SecurityFilterChain和登录接口,实现JSON响应和无状态认证;4. 获取登录用户信息的5种方法,包括SecurityContextHolder和注
2026-02-10 20:55:03
673
原创 Electron Forge集成React Typescript Vite完整步骤
本文介绍了使用ElectronForge创建跨平台桌面应用的全过程。首先通过npx命令初始化项目,选择TypeScript和Vite构建工具,配置了开发、测试和生产环境的脚本命令。然后集成React框架,添加相关依赖并配置TSX组件。针对开发中遇到的安全警告,通过动态配置CSP策略解决,区分开发和生产环境的不同安全要求。最后完善TypeScript配置,设置模块解析路径和严格类型检查。整个过程涵盖了项目初始化、框架集成、安全配置和开发环境优化等关键环节,为构建Electron+React+TypeScrip
2026-02-08 22:23:37
683
原创 Spring Security Oauth2.1 授权码模式实现前后端分离的方案
我在网上查阅了大量资料,始终没找到授权码模式前后端分离的实际落地案例,于是结合前后端做了本地测试,最终梳理出了该模式下前后端分离的可行解决方案
2026-02-06 18:37:40
576
原创 SpringBoot3 当前最新版knife4j openapi3 集成方案
本文介绍了在Spring Boot项目中集成Knife4j和Swagger3 API文档的完整配置方案。主要内容包括:1) 引入Knife4j依赖;2) 配置YML文件设置文档路径、分组和扫描包;3) 自定义OpenAPI属性类;4) 启动类配置;5) 创建OpenAPI配置类定义文档信息;6) 生产环境关闭文档的安全配置。该方案通过属性配置和注解结合的方式,实现了API文档的可维护管理,并提供了开发/生产环境的切换方案。文中还附带了最新注解的参考链接。
2026-02-04 16:50:38
472
原创 OpenAPI 3.0(Swagger3/Knife4j)完整简洁注解清单
摘要:本文整理了OpenAPI 3.0(Swagger3/Knife4j)的完整注解清单,适配Spring Boot3.x和Knife4j v4.x。内容涵盖类/方法/参数/请求体/响应/模型/通用配置等七大类注解,包括@Tag、@Operation、@Parameter、@RequestBody、@ApiResponse、@Schema等核心注解的使用说明和示例代码。这些注解来自io.swagger.v3.oas.annotations包,可完全替代Swagger2旧注解,与Knife4j完美兼容,提供简
2026-02-04 16:15:25
687
原创 Web前端 网页版本更新时同时更新浏览器缓存
本文针对Web前端版本更新与浏览器缓存冲突问题,提出基于NextJS框架的解决方案。通过在入口文件设置禁用缓存元标签、在环境变量中配置版本号,并开发静态资源版本号拼接工具函数,实现版本更新时强制刷新缓存、未更新时复用缓存的效果。方案特别区分了需要手动添加版本号的资源(如图片、第三方CSS等原生标签引入的资源)和NextJS自动处理的模块化导入资源,既保证了缓存控制的精确性,又降低了维护成本。最终达成静态项目版本更新与缓存管理的最优平衡。
2026-02-01 14:41:40
394
原创 Maven依赖管理最佳实践:BOM vs 父模块继承
微服务依赖管理方案对比 BOM方式与父模块继承方式是两种常见的微服务依赖管理方案。BOM方式通过独立模块管理依赖版本,具有高灵活性、清晰架构和低维护成本,适合5+服务的企业级项目。父模块继承方式简单直接但不够灵活,适合1-5个服务的小项目。实际应用中,BOM方式能实现职责分离、明确版本来源和独立升级,符合微服务理念,被Spring等主流框架采用。建议大型项目优先选择BOM方式,小型项目可考虑父模块继承方式。
2026-01-30 15:24:01
593
原创 Nativewind v4 第三方组件使用className的方案
摘要:React Native项目中,使用NativeWind为第三方组件(如fast-image)添加className支持时,可通过cssInterop方案解决样式失效问题。具体步骤为:1)导入cssInterop函数;2)包装目标组件并配置className到style的转换;3)在封装组件中透传className属性。该方法遵循NativeWind v4官方推荐,确保类型安全且性能可接受,已在实际Image组件中验证有效。核心要点是直接包装底层组件而非业务组件,并完整透传样式属性。
2026-01-29 16:28:44
495
原创 Web前端 认证token的安全存储策略
前言:最安全的方案不一定用户体验最优,需根据合适的场景选择安全策略。这里,我主要针对大多数常规业务场景下的实施方案进行分析。这些方案通常不适用于银行、金融、支付等高安全性场景,因为这类场景通常需要进行二次生物验证或其他安全性较强但可能影响用户体验的验证措施。
2026-01-27 15:42:59
965
原创 前端 IndexDB 使用指南
摘要:IndexedDB是浏览器中的大容量本地数据库,适合存储复杂数据(如文件、JS对象等),相比localStorage具有更大容量(250MB+)和更强大的查询功能。本文提供完整的IndexedDB使用指南,包括安装方法、核心操作(增删改查)、React组件集成示例以及工具类封装。重点介绍了IndexedDB与localStorage的对比、适用场景(离线应用、大文件存储等)和注意事项(不适合存储敏感信息)。同时包含版本控制、错误处理等关键概念说明,帮助开发者快速掌握IndexedDB在Web应用中的实
2026-01-27 13:38:49
1005
原创 React Native Andriod清理失败或构建失败时手动清理
Android项目构建失败时,可通过手动清理关键目录解决:删除build/、app/build/和.gradle/目录,这些目录包含构建输出和缓存文件,清理后可重新执行./gradlew clean命令完成构建。
2026-01-27 13:19:01
116
原创 React Native MMKV完整封装
本文介绍了一个基于MMKV的封装架构,包含核心封装和数据隔离加密封装两部分。核心封装通过BaseStorage.ts定义基础存储接口,LocalStorage.ts实现本地数据管理;数据隔离加密封装通过StorageManager.ts管理多用户数据隔离,支持加密存储。架构采用工厂模式创建存储实例,包含普通存储和加密存储两种方式,通过keyGenerator.ts生成动态加密密钥。该方案实现了应用级数据隔离与安全存储,适用于用户敏感数据管理,同时提供灵活的存储切换和清理功能。
2026-01-27 12:44:07
395
原创 ReactNative社区版 集成React Native Paper的项目命名问题
React Native社区版项目命名方式影响集成结果:带下划线命名的项目多次集成失败,而采用大驼峰命名格式的项目则顺利集成。实验表明,社区版项目应遵循大驼峰命名规范以避免兼容性问题。开发者需注意命名规范对项目集成的影响。
2026-01-24 04:04:24
126
原创 ReactNative MMKV和React Native Keychain存储本地数据
React Native存储方案对比与使用指南 本文对比了React Native中两种主流存储方案:MMKV和Keychain。MMKV作为AsyncStorage的替代方案,具有同步操作、高性能、线程安全、支持加密和无容量限制等优势,适合存储非敏感数据。Keychain则提供系统级安全加密,适合存储密码、token等敏感信息。文章详细介绍了两种方案的具体使用方法,包括基础操作、数据加密、多实例管理、监听变化等核心功能,并给出了实用封装示例和场景建议。对于安全要求高的金融、医疗类应用,推荐使用Keycha
2026-01-18 18:28:42
1098
原创 TailWindCss cva+cn管理样式
CVA(class-variance-authority)是一个简化Tailwind CSS样式管理的工具,通过"配方"概念实现组件样式的集中管理。它允许开发者预先定义组件变体(如按钮颜色、尺寸),使用时只需传递参数即可自动生成正确类名,避免了手动拼接样式的繁琐。相比传统方式,CVA提供更好的类型提示、更少的错误和更便捷的修改。配套工具cn(clsx+twMerge)则用于处理临时样式调整和类名冲突。两者配合使用:CVA管理设计规范,cn处理特殊情况,形成完整的样式解决方案。
2026-01-17 19:51:23
1015
原创 Windows 安装多版本JDK实现版本切换
本文介绍了JDK安装与版本切换的配置方法。首先需从Oracle官网下载所需版本的JDK并安装。然后通过系统环境变量设置:1)新建不同版本的JDK路径变量;2)设置JAVA_HOME变量指向当前使用版本;3)在Path中添加%JAVA_HOME%路径。切换版本时只需修改JAVA_HOME指向对应的JDK版本变量即可完成快速切换。整个配置过程包含下载、变量设置和路径检查三个主要步骤。
2026-01-04 14:53:38
362
原创 前端项目架构 项目格式化规范篇
本文介绍了如何通过VSCode和Prettier实现项目代码格式化统一。首先推荐安装必要的VSCode插件并配置统一的setting.json文件,包括编辑器样式、格式化规则等。其次详细说明了在项目中配置Prettier的步骤:安装依赖、创建.prettierrc.cjs配置文件、设置忽略文件、集成ESLint规则等。文章还提供了格式化优先级说明和具体案例,展示了JavaScript/TypeScript代码、React组件、工具函数等在不同场景下的格式化效果。通过这套方案,可以确保团队成员遵循统一的代码风
2025-12-27 13:54:34
550
原创 TanStack Query(React Query) 常用api及操作总结
本文总结了React Query的常用API及操作技巧,涵盖数据查询、修改、缓存管理等核心功能。主要内容包括:1. 常用API分类介绍(查询Hook、修改Hook、缓存管理方法);2. 典型操作场景(基础/分页查询、乐观更新、批量操作);3. 优化技巧(防抖查询、依赖查询);4. 全局配置与请求取消;5. 实战示例(表单提交、分页列表);6. 最佳实践(查询键设计、缓存策略等)。文章提供了详细的代码示例,帮助开发者高效处理React应用中的数据交互需求。
2025-12-21 20:00:21
383
原创 TailWindCss 核心功能总结
TailwindCSS是一款实用优先的原子化CSS框架,通过预定义类名组合快速构建界面,显著提升开发效率。其核心优势包括:实用类直接内联HTML减少样式文件切换、内置响应式设计系统、自动优化的生产包体积(<10KB)。特别适合Web应用开发,已被ChatGPT、Vercel等AI产品采用。提供完善的文档和IDE插件支持,支持自定义主题配置(通过tailwind.config.js)和动态类名管理。虽然学习初期需记忆类名,但通过组件化封装可保持代码整洁。在AI时代因其开发速度和一致性优势,成为现代前端开
2025-12-21 17:43:01
1285
原创 TanStack Query(React Query) 使用总结
React Query(现称TanStack Query)是一个专注于数据获取、缓存和状态管理的React库,通过简化异步逻辑处理提升开发效率。核心功能包括自动化加载/错误处理、智能缓存和声明式Hooks。安装步骤包括创建QueryClient实例、使用Provider包裹应用组件,并通过useQuery发起请求。关键概念如useQuery(用于GET请求)和useMutation(用于增删改操作)提供了数据管理和缓存控制能力。支持全局配置缓存时间(gcTime/staleTime)和灵活的失效策略(主动失
2025-12-14 21:31:49
1056
原创 ReactNative Expo 使用总结(基础)
本文系统总结了React Native开发中的核心知识点,包括路由、样式、组件和动画等关键内容。在路由方面,详细介绍了Expo基于文件的路由框架及其配置方法。样式部分对比了StyleSheet和Styled Components的优缺点,并提供了样式管理的最佳实践。组件章节全面解析了View、Text、ScrollView等基础组件,以及列表、模态框等复杂组件的使用方法。动画部分重点讲解了原生Animated和Reanimated库的使用技巧。此外,还涵盖了第三方常用组件(如WebView、手势处理)、图标
2025-12-05 20:38:26
1421
2
原创 React useMemo和redux createSelector的区别
createSelector与useMemo都是记忆化工具,但适用场景不同。createSelector用于Redux状态派生数据(全局缓存),当输入选择器结果变化时重新计算;useMemo用于组件内部基于props/state的昂贵计算(组件级缓存)。主要区别在于:createSelector面向Redux store数据,支持浅比较;useMemo面向组件数据,基于引用比较。建议组合使用:用createSelector处理Redux数据转换,再用useMemo优化组件内派生数据。典型用例:createS
2025-11-10 16:41:14
450
转载 React Jest单元测试
React单元测试快速指南:介绍React组件测试的基本方法,包括Jest和React Testing Library的使用。涵盖测试渲染、交互模拟和断言验证等核心技巧,适合初学者快速上手。另附详细教程链接,供深入学习和实践参考。
2025-11-07 14:40:00
80
原创 taro UI 的icon和自定义iconfont的icon冲突
摘要:Taro项目同时使用TaroUI和阿里iconfont时出现图标冲突问题。原因是两者font-family名称相同导致图标未正确显示。解决方案是将iconfont.css中的font-family修改为其他名称,避免命名冲突。该方案有效解决了TaroUI组件与阿里图标库的兼容性问题。
2025-11-05 15:14:57
242
原创 Taro 自定义tab栏和自定义导航栏
本文介绍了在Taro小程序中实现自定义TabBar和导航栏的优化方案。文章首先分析了官方方法的不足:无法使用项目自带的iconfont库、每次切换会重新渲染TabBar等问题,提出了基于组件化的实现方案。通过高级组件(HOC)封装页面组件实现公共布局,利用Redux管理TabBar状态,并详细展示了自定义TabBar和导航栏的代码实现。最后总结了关键点:组件化实现更自由、通过HOC解决公共组件渲染问题、Redux状态管理实现Tab切换同步。该方案解决了官方方法的局限性,提供了更灵活高效的自定义导航实现方式。
2025-10-28 11:58:08
718
原创 React 判断组件是否在视图区域的钩子函数
本文介绍了一个React自定义Hook useInView,用于检测组件是否在可视区域内。该Hook基于IntersectionObserver API实现,支持配置触发阈值(默认10%可见)、边界偏移、根元素等参数,并提供单次触发选项。使用方法简单,只需将返回的ref绑定到目标元素,即可通过isInView状态判断可见性。适用于懒加载、动画过渡等场景
2025-09-17 11:32:05
243
原创 React state在setInterval里未获取最新值的问题
React中在setInterval/setTimeout内使用setState时会出现状态值过时问题,这是由闭包导致的。解决方案有两种:1)使用函数式更新setCount(prev=>prev+1)获取最新状态;2)通过useRef保存状态值,在useEffect中同步更新ref.current,在定时器中通过ref获取最新值。这两种方法都能有效解决定时器中状态更新不及时的问题。
2025-09-08 10:37:10
320
原创 前端 下载后端返回的二进制excel数据
前端下载Excel文件方案:通过创建隐藏的a标签,将后端返回的二进制数据转换为Blob对象,设置type为application/vnd.ms-excel,生成下载链接后模拟点击触发下载。自动生成包含日期时间戳的文件名,下载完成后移除创建的DOM元素。该方法无需依赖第三方库,兼容性好,适用于各种浏览器环境下的Excel文件下载需求。
2025-08-20 11:17:37
356
原创 Taro 安全区域
针对顶部刘海区和底部小黑条两个常见问题,推荐使用Taro.getSystemInfoSync()方法获取设备信息。顶部通过safeAera.top获取刘海高度设置paddingTop,底部通过计算screenHeight与safeAera.bottom的差值确定小黑条区域。该方案兼容性好,能有效避免内容被遮挡的问题。
2025-05-21 16:36:43
1111
原创 Taro Error: chunk common [mini-css-extract-plugin]
在Taro项目中,编译时可能会遇到mini-css-extract-plugin插件抛出的CSS顺序冲突警告。这种警告通常是由于项目中不同组件引用的CSS文件顺序不一致导致的。解决方案:1、将示例中 1、2 两个引用的顺序保持一致即可编译成功。2、直接修改/config/index.ts的配置。
2025-05-21 14:28:06
1119
原创 taro 小程序 CoverImage Image src无法显示图片的问题
[渲染层网络层错误] Failed to load local image resource /assets/icon/message.png the server responded with a status of 500 (HTTP/1.1 500 Internal Server Error)
2025-05-20 14:27:06
776
原创 TaroUI AtInput等组件无法正常使用的解决方案
taroUI AtInput 微信开发者工具打印警告 WXMLRT_$gwx:./base.wxml:template:180:18: Template `tmpl_0_35` not found.
2025-05-14 10:43:50
554
2
原创 Antd Upload组件连续回车会多次触发文件夹弹窗的bug修复
思路就是禁用enter快捷键,让upload组件的enter触发失效,这样就可以规避掉这个问题。刚又到Antd官网测试一下这个bug,依然存在。
2025-04-30 18:51:22
358
空空如也
react native devtools新版本无法双向联调的bug
2026-01-28
SpringCloud Sentinel Gateway Nacos
2024-09-21
SpringCloud Maven多模块项目如何导出可以正常运行的Jar包
2024-06-19
身份证实名认证除了第三方提供的付费接口,是否可以查到对应公安的身份证比对接口?
2024-05-16
Netty集群如何做到Channel共享,高并发
2023-01-09
如何保证rocketmq的服务器安全不被别人修改
2022-10-13
SpringCloud搭建Nacos集群基于Nginx,配置文件后报错,如何解决?
2022-04-05
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅