前言 面试题只是一个引子，快速刷题就是背（面试官问你，但是他不一定很深入），想深入理解还是得花大量精力； webpack 的构建流程是什么 初始化参数：解析webpack配置参数，合并shell传入和

在进行多页面开发的时候，项目刚开始阶段，页面较少，编译速度还能忍受，但是一旦页面增加，多次热更新就造成了内存溢出。 可以看到的是webpack把所有的页面都进行了编译，总体积已经达到了18M，耗时超过1分钟，在热更新的时候这个体积会变得更大，从而占据node的运行内存，导致内存…

没有什么比时间更具有说服力了，因为时间无需通知我们就可以改变一切。 Webpack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其打包为合适的格式以供浏览器使…

使用webpack4提升180%编译速度

祸兮福之所倚，福兮祸之所伏。——老子 bundle、module、chunk 都是 webpack 中的术语，下面就一个一个介绍他们的定义是什么，怎么产生的。 Bundle是由多个不同的模块生成，bundles 包含了早已经过加载和编译的最终源文件版本。 **Bundle 分离…

一种是页面刷新，不保留页面状态，就是简单粗暴，直接window.location.reload()。 另一种是基于WDS (Webpack-dev-server)的模块热替换，只需要局部刷新页面上发生变化的模块，同时可以保留当前的页面状态，比如复选框的选中状态、输入框的输入等。…

随着web开发变得越来越复杂，我们需要使用工具来帮助我们构建现代化网站。这是一个完整通过复杂webpack4配置的线上生产例子。 构建现代化网站已经成为自定义应用程序开发，网站期望能做的更多，具有传统应用的功能，而不仅仅是一个推广网站。 随着一个流程变得复杂时，我们就会将它分解…

随着前端工程化的不断发展，构建工具也在不断完善。作为大前端时代的新宠，webpack渐渐成为新时代前端工程师不可或缺的构建工具，随着webpack4的不断迭代，我们享受着构建效率不断提升带来的快感，配置不断减少的舒适，也一直为重写的构建事件钩子机制煞费苦心，为插件各种不兼容心灰…

随着2018年2月15号webpack4.0.0出来已经有一段时间了，webpack依靠着“零配置”，“最高可提升98%的速度”成功吸粉无数，对于饱受项目打包时间过长的我，无疑是看到了曙光，于是决定开始试水。 随着项目的不断迭代，样式文件和js文件的数量越来越多，造成webpa…