Rem-Husband-优快云博客

原创 AI 全栈时代的多语言 SDK 版本管理：认识 mise

介绍 mise 的核心定位、版本选择机制、配置方式、适用场景，以及它与 NVM、Homebrew、asdf 和语言依赖管理器的关系。

2026-08-10 10:39:05 340

原创 Go 包管理笔记 — 面向 JS/TS 前端开发者

包管理部分：包的概念、Go Modules、自定义包、第三方包（logrus / viper）

2026-05-28 16:10:45 390

原创 Go 语言基础笔记 — 面向 JS/TS 前端开发者

基础部分：程序结构、变量、数据类型、运算符、流程控制、数组、切片、Map、指针、函数、字符串处理、类型转换、错误处理、defer/panic/recover

2026-05-28 16:05:00 546

原创 AI 时代如何让 AI 老老实实写代码？OpenSpec 实践指南

介绍 OpenSpec 规范驱动开发框架，通过「先定规范再写代码」让 AI 编程可控可追溯，附完整工作流与实践心得。

2026-04-27 18:46:39 780

摘要 TypeScript装饰器是一种元编程工具，用于修改类、方法、属性或参数的行为，实现横切关注点的分离。文章详细介绍了装饰器的类型（类、方法、属性、参数、访问器装饰器）及其执行顺序：工厂函数从上到下执行，装饰器函数从下到上应用。通过实际代码示例展示了装饰器在日志记录、依赖注入等场景的应用，包括使用reflect-metadata实现自动依赖注入和属性验证。还解释了确定赋值断言(!)的作用，帮助开发者更好地理解和应用这一强大特性。

2026-03-19 20:23:25 397

原创微前端中的 UMD：必要性解析

微前端框架对UMD格式的需求取决于Entry方式：JS Entry需要UMD格式以便主应用访问子应用的生命周期函数，而HTML Entry通过解析HTML自动加载脚本，无需特殊格式。single-spa等JS Entry框架必须使用UMD，而qiankun等HTML Entry框架则不需要。micro-app的UMD模式是一种混合方案，首次完整执行后仅调用生命周期函数以优化性能。研究者在选择微前端方案时，应根据Entry方式判断是否需要UMD，避免常见误区。

2026-03-06 15:22:54 460

原创我的创作纪念日-1024日-技术成长回顾与展望

在这里给小伙伴们拜个晚年，祝小伙伴们新年快乐🎉，马年吉祥，事业马到成功，生活龙马精神！！！

2026-02-26 10:13:58 666

原创移动端 H5 响应式字体适配方案完全指南

基于 rem + 动态根字体 + PostCSS 的生产级适配方案，包含微信大字体适配完整实现

2026-02-25 22:13:15 695

原创 JSBridge 原理详解

JSBridge 是 WebView 中实现 JavaScript 与原生代码通信的关键技术。核心解决两个问题：Native 调用 JS（通过 WebView 执行 JS 代码）和 JS 调用 Native（通过注入 API 或 URL Scheme 拦截）。文章详细介绍了异步回调的实现机制、各平台注入对象命名的差异（Android、iOS、Flutter），并对比了不同通信方式的优缺点。最后给出了最佳实践建议，包括统一封装、消息队列、超时处理等。适用于需要实现 Web 与原生应用深度交互的开发场景。

2026-02-24 16:33:10 808

原创 micro-app 微前端项目部署指南

本文档详细介绍了micro-app微前端项目的两种部署方式：同域部署和跨域部署。同域部署将主应用和子应用部署在同一域名下，配置简单但扩展性受限；跨域部署允许应用独立部署，但需配置CORS。文档提供了Nginx配置示例，包括CORS设置、路由回退和静态资源缓存策略，并说明了环境变量的配置方法。最后给出了构建和上传部署产物的具体步骤，帮助开发者快速完成生产环境部署。

2026-02-07 15:36:00 795

原创从零到一：基于 micro-app 的企业级微前端模板完整实现指南

本文详细记录了基于micro-app框架构建企业级微前端模板的完整实现过程。项目采用技术栈，实现了完整的主子应用通信、路由同步、独立运行等核心功能。

2026-02-07 15:31:28 878

原创 Qiankun 微前端实战踩坑历程

本文记录了企业级中后台系统采用 qiankun 进行微前端改造的全过程，涵盖技术选型、实现方案和问题解决经验。

2026-02-04 13:19:19 816

原创踩坑记录：iOS Safari 软键盘下的“幽灵弹窗“问题

iOS Safari 中“幽灵弹窗”问题解析：当软键盘弹出时，iOS保持布局视口不变而仅调整视觉视口，导致fixed定位弹窗的视觉位置与点击区域错位。该问题在页面切换后会因滚动状态残留而加剧。解决方案核心在于锁定body滚动，强制布局视口与视觉视口保持一致。通过保存当前滚动位置并设置body为fixed定位，可有效避免点击错位问题。此方案适用于所有基于WebKit的iOS浏览器。

2026-02-04 12:55:37 1056

原创使用PC浏览器devTool工具调试安卓手机h5页面

移动端H5页面调试指南本文详细介绍了在安卓设备上调试H5页面的两种方法：USB调试和无线调试。通过开启开发者选项，使用ADB工具连接设备后，可在电脑浏览器中实时检查移动端页面元素和布局问题。文章还提供了常见问题的解决方案，如连接失败、授权异常等，并解释了ADB工作原理。这些方法能有效解决移动端浏览器兼容性和布局异常问题，提升前端开发效率。

2026-01-17 10:32:08 1191

原创 Qiankun 微前端通信与路由方案总结

本文总结了qiankun微前端框架下主子应用通信和路由跳转的解决方案。通信方面，基于Pinia实现自定义状态管理，避免与qiankun内置API冲突，并提供实时同步和按需获取两种模式。路由方面，采用子应用memoryHistory+主应用统一导航的方案，解决路由冲突问题，支持深层路由直接访问。方案包含运行时校验、路由同步机制和子应用初始路径处理等细节，为企业级微前端应用提供了稳定可靠的基础架构。

2026-01-14 10:37:15 1164

原创 Qiankun 两种加载模式registerMicroApps和loadMicroApp对比分析

qiankun微前端框架提供两种子应用加载方式：registerMicroApps+start（自动路由管理）和loadMicroApp（手动控制）。前者适合简单路由切换场景，后者支持多应用并行加载等复杂需求。关键区别在于路由控制方式、容器管理和多应用支持能力。registerMicroApps模式需容器常驻DOM且存在路由冲突风险，而loadMicroApp可灵活控制生命周期，特别适合仪表盘、工作台等需要同时展示多个子应用的场景。开发者应根据实际需求选择。

2026-01-14 10:21:40 1106

原创从弹窗变胖到 npm 依赖管理：一次完整的问题排查记录

摘要：本文记录了一个Vue3+Element Plus项目中的弹窗样式异常问题排查过程。从表面样式问题追溯到npm镜像失效、Node版本冲突、依赖版本升级等工程化问题。通过分析问题链，提出了统一镜像地址、锁定Node版本、严格依赖管理等解决方案，并总结了前端工程化中依赖管理的重要经验教训。文章强调lock文件的重要性，提醒开发者不要轻易删除lock文件，并分享了版本范围符号、SemVer规范等实用知识点。

2026-01-05 10:20:44 741

原创 Single-SPA 学习总结

Single-SPA 是微前端领域的"鼻祖"框架，它是一个用于前端微服务化的 JavaScript 框架，允许你在同一个页面中使用多个框架（React、Vue、Angular 等），而不需要刷新页面。

2025-12-28 10:19:41 858

原创 Vue3 + Axios 企业级请求封装实战：从零搭建完整的 HTTP 请求层

本文分享了一套经过生产验证的Axios封装方案，适用于Vue3+TypeScript项目。方案采用分层架构设计，包含业务层、HTTP实例层、Axios封装层和工具层。核心实现包括：1）Axios类封装，提供通用请求和分页请求方法；2）请求拦截器统一处理请求头，注入平台标识、设备信息、Token认证、营销追踪等关键参数；3）支持多端环境适配（H5/微信/App）。该方案实现了企业级项目所需的统一请求管理、安全传输和错误处理机制。

2025-12-23 10:20:23 1236

原创微信扫码登录 iframe 方案中的状态拦截陷阱

微信扫码登录 iframe 方案中存在状态拦截失效问题：当用户在扫码授权前取消勾选协议时，虽然父页面拦截了 postMessage，但 iframe 回调页面已提前写入 cookie，导致登录仍能完成。问题根源在于 iframe 回调页面越权操作了登录状态（cookie）。解决方案是明确职责边界，让 iframe 只负责传递 token，由父页面根据协议状态决定是否设置 cookie 和完成登录。这提醒我们在跨 iframe 通信时要严格划分组件职责，避免状态操作分散导致控制失效。

2025-12-17 11:27:36 602

原创微前端实现方式：HTML Entry 与 JS Entry 的区别

微前端架构中，HTML Entry和JS Entry是两种核心的子应用加载方式。HTML Entry通过解析子应用的HTML入口文件加载资源，适合已有SPA项目快速接入，提供自动化的样式隔离和沙箱环境。JS Entry则直接加载JS模块，要求子应用显式实现生命周期函数，更适合全新设计的微前端系统。两种方式在接入成本、资源加载、隔离能力和构建部署等方面存在显著差异。HTML Entry更偏向声明式、低侵入的解决方案，而JS Entry则提供更高自由度和控制权。实际选择需根据项目特点、团队能力和技术需求综合考量

2025-12-15 20:53:25 814

原创记录一次微前端改造：把 10+ 个独立 Vue 项目整合到一起

本文记录了将10+个独立Vue项目整合为微前端架构的实践经验。项目背景是公司多个独立部署的Vue应用存在体验割裂、重复建设等问题。技术选型上选择了京东micro-app方案，因其简单易用，子应用改造成本低。具体实现包括：新建基座应用作为容器，配置路由和micro-app组件；子应用只需添加public-path文件和改造入口文件即可接入。状态共享沿用现有localStorage方案，部署保持各应用独立。该方案显著改善了用户体验，减少了页面跳转白屏时间，同时保留了子应用独立运行能力。

2025-12-14 14:06:55 909 1

原创 Vue 组件解耦实践：用回调函数模式替代枚举类型传递

本文通过一个登录模块重构案例，介绍了使用回调函数模式解耦Vue组件的方法。原有实现中父组件依赖子组件的枚举类型来判断操作来源，导致代码耦合度高、扩展性差。重构后子组件将后续操作封装为回调函数保存，父组件只需在协议确认后通知子组件执行回调，无需了解具体操作细节。这种模式降低了组件耦合度，提高了代码可维护性和扩展性，适用于异步确认流程、多入口单出口等场景。文章还对比了两种方案的优劣，并强调了组件职责单一的重要性。

2025-12-12 12:36:47 514

原创多标签页登录状态同步：一个简单而有效的解决方案

本文介绍了一种解决多标签页登录状态同步问题的简单方案。通过在登录页面启动定时器轮询Cookie中的token状态，当检测到token存在时自动刷新页面，实现多标签页登录状态的实时同步。该方案具有实现简单、用户体验好、资源可控等优势，并提供了定时器管理、Cookie操作等技术细节。文章还对比了BroadcastChannel API这一更优方案，指出其实时性和性能优势。最终方案选择需权衡兼容性、实现复杂度等因素。

2025-11-26 11:06:56 751

原创从“版本号打架”到 30 秒内提醒用户刷新：一个微前端团队的实践

本文介绍了一个微前端团队解决"版本号打架"问题的实践方案。团队通过纯前端轮询version.json文件的方式，在30秒内感知版本更新并提醒用户刷新。方案采用构建时生成唯一版本号、运行时轮询比对的技术路径，结合Nginx精准缓存控制，实现了零侵入的CI/CD集成。关键点包括：版本号生成一致性保障、轮询请求的缓存规避策略、以及页面激活时的即时检查机制。该方案有效解决了测试环境版本滞后问题，提升了交付效率。

2025-11-22 13:47:31 798

原创 TypeScript 类型工具与 NestJS Mapped Types

NestJS 的 @nestjs/mapped-types 提供了一套类型工具（如 PartialType、PickType、OmitType），与 TypeScript 内置类型工具（Partial、Pick、Omit）存在关键差异。NestJS 的类型工具会生成运行时存在的类，保留装饰器和验证元数据，适用于 DTO 和验证场景；而 TypeScript 内置类型仅用于编译时类型检查。开发时应根据需求选择：DTO 类使用 mapped-types，纯类型操作使用内置类型工具，并保持项目一致性。

2025-11-14 11:29:24 384 1

原创 Vue 3 超强二维码识别：多区域/多尺度扫描 + 高级图像处理

Vue 3 二维码识别工具库 vue-qrcode-scanner，解决传统识别中的三大痛点：复杂背景难识别、小二维码识别率低、识别速度慢。该库提供多区域/多尺度扫描策略，内置多种图像预处理算法（OTSU、自适应阈值、锐化等），支持Composable API和工具函数两种使用方式。具备零依赖、TypeScript支持等特性，可快速集成到项目中。适用于从文件或URL解析二维码，返回内容包括数据和位置坐标。安装简单，只需配合jsQR算法库即可使用，适合需要稳定高效二维码识别的前端项目。

2025-11-10 16:04:39 1182

原创基于Cookie的SSO单点登录系统设计与实现

本文详解基于Cookie的SSO单点登录系统，涵盖核心概念、架构（认证中心+业务应用+共享Cookie）、实现（认证中心接口、客户端SDK、Vue集成等），含安全措施、开发适配与部署，分析优劣势及适用场景，提供完整解决方案。

2025-09-17 20:45:50 814

原创初探微前端：技术架构思想与主流实现方案

微前端是一种将前端应用拆分为独立子应用的架构思想，支持技术栈无关、独立开发部署和运行时集成1。其核心优势包括提升团队协作效率、模块解耦和渐进式技术升级，主流方案如qiankun通过沙箱隔离实现灵活集成

2025-09-17 20:26:41 1444

原创 vue-route-query-hook：一个用于 Vue 3 的 Composable，提供响应式参数与 URL 查询参数之间的双向同步功能

vue-route-query-hook 是一个 Vue 3 的 Composable 工具，用于实现响应式参数与 URL 查询参数的双向同步。它提供类型安全支持，支持排除字段、空值处理等配置选项，可通过 useRouteQuery 方法轻松集成到项目中。该工具轻量无依赖，基于 Vue 3 Composition API 和 Vue Router 4，支持自动类型转换和历史记录管理，适用于需要保持状态与 URL 同步的场景。

2025-08-05 10:30:19 661