前端工程化

React 刷新页面 Token 消失？深度解析 Redux + LocalStorage 数据持久化方案与 Hook 避坑指南在 React 应用开发中，Token 管理是安全与用户体验的核心。许多开发者初期会产生一个疑问：既然已经使用了功能强大的 Redux 进行全局状态管理，为什么还需要手动封装 LocalStorage 操作？本文将从响应式原理、Hooks 调用限制以及工程化解耦三个维度进行解析。

Rspack核心解析：Rust重写Webpack的性能革命与本质前端构建工具赛道历经多年迭代，已形成 Webpack、Vite、Rspack 三足鼎立的格局。Webpack 作为老牌王者，以“兼容万物、生态完善”支撑了无数项目；Vite 凭借“原生ESM、按需编译”革新了开发体验；而字节跳动出品的 Rspack，则以“Rust 重构、兼容 Webpack”的特质，成为兼顾性能与生态的新选择。很多开发者会困惑：三者核心差异是什么？为什么 Rspack 能实现“性能碾压”又“零成本迁移”？本文将从三者对比切入，层层拆解 Rspack 的核心原理、性能本质，最终给出清晰的项

怒放的生命1991

pnpm + Monorepo 使用教程（集成 Vue 3 项目）本文档指导你将现有 Vue 3 项目 my-space-web 迁移到基于 pnpm 的 monorepo 架构中，实现高效、可扩展的多包管理。

意图OS是未来软件形态，它到底解决了什么问题？先说一句现在操作系统（无论是Windows、macOS、Android、iOS...）的通病：“操作系统懂很多指令，却不懂你干嘛。”

眯眼因为很困啦

GitHub Fork 协作完整流程适用于：开源项目二次开发、插件扩展、给上游项目提交 PR（Pull Request）Fork 是把别人的 GitHub 仓库复制一份到你自己的账号下：

node-sass 迁移 sass(dart-sass) 后样式报错？用 loader 先把构建救回来仓库：vue-cli-plugin-sass-compat GitHub：github.com/myltx/vue-c…

user8615818578154

记一次Vue 2主应用集成Vue 3子项目的Monorepo迁移踩坑指南最近在进行Monorepo架构调整，需要将一个现有的Vue 3(Vite)项目作为一个子应用 (apps/wj) 迁移到由Vue 2(Webpack)主导的大仓中。本以为只是简单的“文件夹移动”，结果在依赖管理、网络代理和端口映射上踩了一圈坑。

React基础框架搭建8-axios封装与未封装，实现 API 请求管理：react+router+redux+axios+Tailwind+webpacknpm install axios一、api基础使用（未封装）1、在 src/api/ 目录下创建一个新的文件 productService.js，用于管理所有的 API 请求。

告别 CJS 库加载兼容坑在Vue3项目集成Electron开发桌面端时，刚引入Electron就抛出「__dirname is not defined」的报错，直接陷入卡点。同样是引入CommonJS规范的类库，之前集成strip-ansi这类CJS库全程顺畅无报错，为何换成Electron就出现兼容问题？带着这个核心疑问，我深入梳理了Vite与Webpack处理CJS库的底层实现逻辑，也厘清了两大构建工具在ESM/CJS语法混用场景下的核心差异，同时找到了解决Electron引入报错的标准方案。

前端性能优化利器：LitePage 轻量级全页设计解析在前端开发领域，“性能”永远是绕不开的核心命题。随着单页应用（SPA）的普及，框架封装带来的开发效率提升有目共睹，但随之而来的“容器初始化瓶颈”也逐渐成为很多应用的性能痛点——用户打开页面后，长时间面对白屏等待，仅仅是为了加载庞大的框架核心代码、路由系统、状态管理库等“基础设施”。

⚡全局自动化：我用Vite插件为所有CRUD组件一键添加指令在现代前端开发中，我们经常使用组件库来快速构建界面。以avue-crud为例，这是一个常用的CRUD表格组件，但在实际项目中，我们往往需要为每个avue-crud组件添加相同的指令或属性。传统做法是在每个使用该组件的地方手动添加指令，这不仅重复劳动，而且容易遗漏，维护起来也十分困难。

npm patch 实用指南：依赖包临时修复的正确姿势在日常开发中，你是否遇到过这样的窘境：项目依赖的第三方包突然爆出 bug，导致功能异常，但上游作者迟迟未发布修复版本？直接修改 node_modules 里的代码虽然快捷，却会在下次 npm install 时被覆盖；fork 仓库自己维护又过于繁琐。

前端工程化概述：从项目搭建到部署前端工程化是将软件工程的方法和理念应用于前端开发，把分散的开发个体、杂乱的代码组织起来，形成一套规范、高效、有序的开发流程。它涉及到项目的整个生命周期，从最初的项目搭建，到开发过程中的代码管理、构建优化，再到最后的部署上线和监控维护。

告别全局污染：深入理解 ES Modules 模块化与构建工具这一篇将解决前端工程化中最重要的问题之一：如何组织代码。在 ES Modules 出现之前，JavaScript 没有原生的模块系统，导致全局变量满天飞。这篇文章将带你彻底理解现代前端模块化方案。

转转技术团队

基于微前端 qiankun 多实例保活的工程实践在中后台系统的实际业务场景中，通常会遇到以下场景：在传统的实现中，当用户从"订单管理"切换到"库存查询"时：

一文读懂 Chrome CRX📦：你需要了解的核心知识点大家好!欢迎来到Maxkim的技术博客，插件显而易见,像"篡改猴",“Vue Devtools”无处不在，那么如何进行插件编写到编写的插件怎么分发打包就成了工程化的必学之课，关于插件可以看JustHappy的开源项目，源码简单，上手难度小 (「chrome extensions🛠️」超级简单的浏览器插件Vue开发模板用Vue + JS去开发) ,这里为大家讲解Crx打包内容。总结一句话打包就是输入->输出--依靠脚本

从 useState 到 useEffect：React Hooks 核心机制详解React Hooks 是 React 16.8 引入的一组以 use 开头的函数，让函数组件也能拥有状态（state）、生命周期和副作用处理能力——这些原本只有类组件才能做到。

让宠物打冰球！手把手教你用 Coze 多模态工作流 + Vue 3 打造 AI 拟人生成器让你的宠物闪耀橄榄球场！上传一张照片，选择号码与位置，AI 即刻生成你家猫狗身穿战袍、驰骋冰场的拟人化形象。本文将带你用 Coze 多模态工作流 + Vue 3，从零打造这个趣味 AI 应用。

行走的陀螺仪

前端基建从0到1搭建步骤清单（含工具选型+配置要点+落地注意事项）明确项目场景、团队规模、技术栈偏好，避免盲目选型导致后期重构。