需要读到入口文件里面的内容。 分析入口文件，递归的去读取模块所依赖的文件内容，生成AST语法树。 我们创建了add.js文件和minus.js文件,然后 在index.js中引入，再将index.js文件引入index.html。 现在我们打开index.html。你猜会发生什…

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

2020年即将到来,在众多前端的招聘要求里,webpack、工程化这些字眼频率越来越高。日常开发者中，我们常常在用诸如vue-cli、create-react-app的脚手架来构建我们的项目。但是如果你想在团队脱颖而出(鹤立鸡群)、拿到更好的offer(还房贷)，那么你必须去深…

webpack 对于每个前端儿来说都不陌生，它将每个静态文件当成一个模块，经过一系列的处理为我们整合出最后的需要的 js、css、图片、字体等文件。来自官网的图很形象的阐述了 webpack 的功能 —— bundle js / css / ... （打包全世界ヾ(◍°∇°◍)…

Hot Module Replacement（以下简称：HMR 模块热替换）是 Webpack 提供的一个非常有用的功能，它允许在 JavaScript 运行时更新各种模块，而无需完全刷新。 当我们修改代码并保存后，Webpack 将对代码重新打包，HMR 会在应用程序运行过程…

在webpack4之前，提取公共代码都是通过一个叫CommonsChunkPlugin的插件来办到的。到了4以后，内置了一个一模一样的功能，而且起了一个好听的名字叫“优化” 好了，就写到这里吧，想必大家也看累了吧，辛苦大家了，哈哈。

一. 准备活动 首先创建两个项目，一个叫 webpack-project，另一个叫 mn-webpack 。前者用于观察打包结果，后者用于简单实现 webpack。 项目建立好之后，首先进入到 webpack-project 中，新建一个 src 文件夹和webpack.con…

首先，没有标题党！这套教程确实是免费的，并且针对每节讲解准备了对应的代码，代码环境是webpack4。 课程以常见的webpack4用法为主线，按照从易到难的顺序，逐步引导搭建，渐进式教程真香。 说句实在话，webpack4其实完全靠文档，但是刚入手的时候还是有个简易教程比较好…

之前用过gulp、grunt，但是一直没有学习过webpack。这两天刚好有时间，学习了下webpack。webpack要想深入研究，配置的东西比较多，网上的资源也有很多。我这里学习的主要途径是webpack官方给出的指南，和webpack中文网的翻译版本。因为我觉得第一手资料…