Webpack 迭代到4.x版本后，其源码已经十分庞大，对各种开发场景进行了高度抽象，阅读成本也愈发昂贵。但是为了了解其内部的工作原理，让我们尝试从一个最简单的 webpack 配置入手，从工具设计者的角度开发一款低配版的 Webpack。 假设某一天，我们接到了需求，需要开发…

大家好我是林三心，因为之前校招面试被问过babel的原理，那我今天就写篇文章简单讲讲babel的原理吧。

前言 大家好，我是林三心，标题腾讯面试官：同学，你说你会Webpack，那说说他的原理？，是本菜鸟在面试腾讯时，面试官说的问的原话，一字不差，哈哈。本菜鸟当时肯定是回答不上来，最后也挂了。今天就简单实

随着多终端设备的迅速普及，Web前端开发的复杂性和应用场景日益扩大，Webpack在前端构建演变的工程化浪潮中担当起了针对不同应用场景打包的大任。 如今，Webpack可谓是JavaScript社区最伟大的项目之一。 本文力争从源码层面窥探Webpack的实现原理。文中出示了核…

webpack 是一个现代 JavaScript 应用的静态模块打包器。那么 webpack 是怎样实现不同种类资源模块加载的呢？ 没错就是通过 loader。loader 用于对模块的源代码进行转换。loader 可以使你在 import 或加载模块时预处理文件。 webpa…

上一篇 「webpack 核心特性」loader 说到 webpack 的 loader 机制，本文主要聊一聊另外一个核心特性：插件(plugin)。 插件机制就是为了完成项目中除了资源模块打包以外的其他自动化工作，解决上述的问题。 plugin 是用来扩展 webpack 功…

在搬砖过程中，webpack 常见的问题我们都能解决。 但当在实战中遇到很特殊的需求或者社区、webpack issues 中找不到解决方案时，我们就需要自己手写 loader 、手写 plugin 和了解 webpack 的工作原理了。 本文从几个面试管常问的问题，介绍 we…

本文通过精美的图文，深入分析 Webpack Loader 的运行机制，带你吃透 Webpack loader 的 11 个核心问题。

经常逛 webpack 官网的同学应该会很眼熟上面的图。正如它宣传的一样，webpack 能把左侧各种类型的文件（webpack 把它们叫作「模块」）统一打包为右边被通用浏览器支持的文件。webpack 就像是魔术师的帽子，放进去一条丝巾，变出来一只白鸽。那这个「魔术」的过程是…