All Posts

前端工程化是一个很大的词，就像让你去盖一栋楼，前期的规划设计，方案验证，再到原材料购买，协调人力，工期管理，验收交付等。可以发现前端开发从某种程度上来说，跟你去盖楼没啥本质区别，有时候你可能是需要盖一栋新楼（从 0 到 1 的新需求），而有时候你可能是需要在盖了一半的楼上继续施工（基于已有项目，再开发新功能），你也可能被安排去修修电路，管道啥的（修复一个已有问题）。 那么具体到前端工程化，有哪些我...

在公司真正的商业项目中，当前使用的都是 webpack,而我自己搞 demo 之类的，会更偏向于 vite 这种开箱即用的。那么这两个打包工具，究竟有哪些差异？我们在不同的场景下又应该如何抉择呢？ 一句话结论：如果没有企业级高复杂度打包定制需求，请直接选用 vite。 接下来我们再讨论几个细节： 它们的核心实现原理？webpack 是构建时打包（bundle-based），而 vite 是基于原生...

React 事件是什么？ React 事件是 React 框架对于浏览器原生事件的一层封装，称为合成事件，相当于一个事件综合处理系统。在页面上点击一个按钮时，浏览器会产生一个原生的事件，React 并不会给每一个按钮都加一个单独的监听器，而是在整个组件树的顶部（根 DOM 节点）设立一个调度中心。事件会冒泡到顶部，React 随后会创建一个合成事件对象，这个对象抹平了不同编辑器之间的差异，提供了一...

loader 是什么？ 是一个文件处理器 为什么需要 loader？ webpack本身只能处理 js 文件，而通过 loader 可以让 webpack 处理非 js 的文件（比如图片，css等），把它们变成可以识别和打包的模块。 它是如何工作的？ 1. 匹配文件：在配置中定义规则（如 test: /\.css$/），指定哪些文件由 loader 处理。 2. ​转换内容​：loader 是函数...

async/await 是什么？ "async/await 是 JavaScript 处理异步操作（如网络请求、文件读取）的"语法糖"，它让我们能用写同步代码的方式写异步逻辑，避免层层嵌套的回调函数。 底层依赖 Generator 的暂停/恢复机制和 Promise 的状态管理，async 函数总返回 Promise，即使内部返回普通值也会被自动包装为 Promise.resolve(value)...