前端工程化

厌倦了重度耦合？我用 Vue3 撸了一个真·插件化中后台框架做前端这些年，经手过大大小小几十个中后台项目。市面上的开源 Admin 模板很多，UI 一个比一个炫酷，但真用到实际业务里，往往有一个致命的痛点：强耦合。

前端工程化七连问：从紧急修复到版本控制，一文打通工程化任督二脉本文系统梳理前端工程化中的7个高频问题：npm 紧急修复、代码分包、分支部署、browserslist、CJS 转 ESM、Git Hooks、Semver。每个问题附带原理分析和实战方案。

令人头痛的前端环境令人头痛的前端环境——从一次 npm i 报错说起前段时间 clone 了一个开源项目，本地执行 npm i 安装依赖后，启动开发服务器时报了下面这个错：

当时只道寻常

像使用 Redis 一样操作 LocalStorage参考 Redis 缓存接口封装 LocalStorage，在全栈项目中保持一致的缓存操作体验，降低前端同学转向全栈开发的心智负担

前端避坑指南：一文吃透 npm 幽灵依赖（Phantom Dependency）作为前端开发者，你是否遇到过这样的场景？本地开发时代码运行得好好的，一到 CI 构建、线上部署就报 Module not found；自己电脑能正常启动项目，同事拉取代码重装依赖后却直接报错；明明没在 package\.json 里声明某个包，却能在代码里直接 import 并用得风生水起。

从零搭建 Monorepo 自动发布工作流（GitHub Actions + pnpm + Lerna）如果你正在使用 pnpm + Lerna 管理 Monorepo，并且希望 PR 合并到 release 分支时自动发布 npm 包并同步 master 分支，直接复制下面最后的 GitHub Actions 配置即可开箱即用：

当时只道寻常

npm-check-updates 最全用法合集本文整理 npm-check-updates （简称 ncu）从入门到实战的全部常用命令，一站式解决项目依赖检查、升级、筛选、配置等场景，适用于 Node.js 项目，复制即用。

你的 MR 超过 500 行了吗？——大型代码合并请求拆分实战指南前段时间，Node.js 社区一个引发热议的 PR 让我深有感触——Virtual File System for Node.js #61478，一个约 2 万行改动、130 个 commit 的超大 PR，从 1 月提交到 4 月仍未合入，期间经历了架构方向争论、多轮返工、被迫转回 Draft 重写 Review Guide。

从 400 行到 40 行：一个 WebRTC 播放器的简洁实现之道做 WebRTC 播放器，90% 的代码不是在"做播放"，而是在"处理复杂度"。原生 WebRTC API 有多复杂？光是完成一次播放，你需要理解这些概念之间的关系：

踩着两条虫

VTJ.PRO 在线应用开发平台的构建与发布脚本本文档详细介绍了位于 scripts/ 目录下的自动化脚本。这些工具用于管理 VTJ.PRO 平台的整个生命周期，包括项目模板打包、环境清理，以及为“完整版”和“云版”两种部署变体生成可用于生产的发布产物。

重磅！Vue3 手势工具正式发布！免费使用！vue3-touch-events 是 Vue3 专用触控事件库，可在任意 HTML 元素上启用 tap、swipe、touch、hold、drag、zoom 等事件，一套语法同时支持 PC 鼠标与移动端触屏，全局注册后全项目可用，无需改造组件。基于 MIT 协议开源，仅支持 Vue3。

Vercel 自动部署完全指南：从配置到问题排查Vercel 作为现代化的前端部署平台，最吸引人的特性之一就是与 GitHub 的无缝集成——当你推送代码到仓库时，Vercel 会自动触发部署，实现真正的 GitOps 工作流。然而，在实际使用中，不少开发者都遇到过“代码推送了，Vercel 却没反应”的尴尬情况。

什么是 Harness Engineering，为什么最近都在说它大家好，我是拭心。最近 Harness Engineering 很火，国内外都在谈论它，我们也来简单聊聊。

你删过 lock 文件吗？聊聊包管理器迁移中 90% 的人会踩的坑"删掉 node_modules 和 package-lock.json，重新 npm install 一下。"

Vite 环境变量一个隐藏大坑：为什么 `import.meta.env?.XXX` 会让你线上翻车？在用 Vite 开发前端应用时，import.meta.env 基本是人手一套：切环境、改接口地址、打开/关闭某些特性，几乎都要依赖它。

Vite 和 Wepack 中如何处理环境变量.env: 所有环境都会加载 .env.local: 所有环境都会加载，但被 git 忽略 .env.[mode]: 只在指定模式下加载（如 .env.development、.env.production） .env.[mode].local: 只在指定模式下加载，且被 git 忽略

熬夜通宵读完 VitePlus 全部源码，我后悔没早点看尤雨溪搞了个大的。我花一整夜把它拆了个底朝天，发现这东西远比你想的恐怖。3 月 13 日深夜，尤雨溪在 X 上发了一条推文，平静地宣布了一件大事：

踩坑记录：Mac M系列芯片下 pnpm dlx 触发的 esbuild 架构不匹配错误在日常开发中，克隆一个前端项目后，我们习惯性地执行 pnpm install 和 pnpm dev。但最近在搭载 Apple Silicon (M系列芯片) 的 Mac 上，项目启动时却抛出了一个极其刺眼的致命错误，甚至重新 git clone 项目也无法解决。

《前端工程化：从零重构》课程第一章：混乱的起源 —— 当项目失去秩序副标题：从手动管理 <script> 标签到理解模块化的必要性完成本课后，你将能够：我们将创建一个简单的 Todo List，但故意采用最原始、最手工的方式来组织代码。

徒手开荒-我用纯Nodejs+pnpm+monorepo改造了一个多vue2的iframe"微前端"项目LabLIMS是一个实验室信息管理系统，前端架构采用了一种"类微前端"的设计模式——通过iframe将多个独立的Vue2子项目组织在一起。这种架构在项目初期确实带来了模块解耦的好处，但随着项目规模的扩大，问题也日益凸显。