webpack 是一个模块打包器，在它看来，每一个文件都是一个模块。 无论你开发使用的是 CommonJS 规范还是 ES6 模块规范，打包后的文件都统一使用 webpack 自定义的模块规范来管理、加载模块。本文将从一个简单的示例开始，来讲解 webpack 模块加载原理。 …

带你弄懂使用webpack时chunk、bundle、module这些概念；分析打包流程，让你对webpack有更深入的理解

想必大家都用过 webpack，也或多或少了解它的原理，但是不知道大家有没有写过 Webpack 的插件呢？ 今天我们就一起来写一个划分 Chunk 的 webpack 插件吧，写完后你会发现想怎么分

手摸手教你如何使用webpack，让你在动手实践的过程中感受webpack。webpack版本：5.58.1

则会返回template目录下的所有后缀为.ejs模块的引用，包含子目录。 以及一个匹配文件的正则表达式。 导出的方法有 3 个属性： resolve, keys, id。 resolve 是一个函数，它返回请求被解析后得到的模块 id。 keys 也是一个函数，它返回一个数组…

注意：HMR功能对js的处理，只能处理非入口js文件的其他文件。 ​ 1. eval-cheap-source-map hash：每次wepack构建时会生成一个唯一的hash值。 问题:因为js和css同时使用一个hash值。 如果重新打包，会导致所有缓存失效。 chunkh…

其原理就是将 CSS 文件中的每个 className 按照一定的规则映射为另一个唯一的字符串，以保证 className 在全局作用域内不会重复和冲突。配置方法也很简单，只需要在 webpack 的 css-loader 中添加一个 modules 配置项即可，具体请参考 c…

展开运算符 ... Chainable 以able 为后缀表示具有什么能力。这个库维护了 parent ,用end来实现链式。很像jq的end(). ChainedMap.js ChainedSet.js 这两个里面分别包装了 js 原生的 Map, Set 结构。 打开这个文…

当我作为面试官和一些候选人聊这个话题的时候, 我得到的答案五花八门, 比如谈目录规范, 编码规范, 做个脚手架, 增加单元测试, CodeReview 等等, 我的直觉告诉我这些和前端工程管理有关系, 但这些一定不是前端工程管理的本质, 但是当我们理不清本质的时候, 可以试着从…