前几天 webpack 作者 Tobias Koppers 发布了一篇新的文章 webpack 4.0 to 4.16: Did you know?(需翻墙)，总结了一下webpack 4发布以来，做了哪些调整和优化。 并且说自己正在着手开发 webpack 5。 正好我也在使…

Webpack可以将其理解是一种基于事件流的编程范例，一个插件合集。 而将这些插件控制在webapck事件流上的运行的就是webpack自己写的基础类Tapable。 将plugin控制在webapack事件流上运行（如下图）。后面我们将看到核心的对象 Compiler、Com…

组内负责的几个项目都有一些一样的公共组件，所以就着手搭建了个公共组件开发脚手架，第一次开发 library，所以是参考着 iview 的配置来搭建的。记录如何使用webpack4搭建一个library的脚手架 然后就是书写配置文件。 我写的 library 的目录结构如下，仅供…

webpack4发布以来，我写项目都是用脚手架，即使再简单的项目，真的是really shame。。虽然道听途说了很多 webpack4 的特性，却没有尝试过，因为它给人的感觉就是，em...很难。但是今天我从最简单的部分开始，一点点搭建起一个项目。 而 webpack4 的 …

webpack前端工程中扮演的角色越来越重要，它也是前端工程化很重要的一环。本文将和大家一起按照项目流程学习使用wbepack，妈妈再也不用担心我不会使用webpack，哪里不会看哪里。这是一个由浅入深的文章。 现在vue、react等脚手架都会自动将开发环境使用的webpac…

webpack 打包优化并没有什么固定的模式，一般我们常见的优化就是拆包、分块、压缩等，并不是对每一个项目都适用，针对于特定项目，需要不断调试不断优化。 对于 webpack4，建议从零开始配置，在项目初期，使用 webpack4 默认的配置。 接下来，本篇文章会列出所有适用于…

对于入门选手来讲，webpack 配置项很多很重，如何快速配置一个可用于线上环境的 webpack 就是一件值得思考的事情。其实熟悉 webpack 之后会发现很简单，基础的配置可以分为以下几个方面： entry 、 output 、 mode 、 resolve 、 modu…

另外可以发现并不是一个 token 对应一个 Node，等号左右必须都有值才能组成一个声明语句，否则会作出警告，这就是 eslint 的基本原理。最后所有的 Node 组合在一起就形成了 AST 语法树 通过 @babel/traverse 我们能够轻松的找到 await 表达…

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