webpack性能优化中必不可少的一环就是externals，本文详细阐述externals的使用场景以及如何使用

｜д•´)!! 这里是属于webpack的世界，没有花哨艳丽的vite，有的，仅仅是繁衍到巅峰的webpack！

通过 Webpack5 的 Asset Module（资源模块），我们可以以一种更简捷的方式替换 raw-loader、url-loader、file-loader 来处理图片、字体等资源。

用某度翻译后：“该插件将CSS提取到单独的文件中。它为每个包含CSS的JS文件创建一个CSS文件。它支持CSS和SourceMap的按需加载。” 搭建个简单的Wenpack Demo，演示一下。 先安装MiniCssExtractPlugin插件。 安装成功后，在webpack…

做了一夜动画，让大家十分钟搞懂Webpack 一、什么是webpack webpack是一个打包工具，他的宗旨是一切静态资源皆可打包。 二、原理分析 首先我们通过一个制作一个打包文件的原型。 假设有两

Plugin(插件) 是 webpack 生态的的一个关键部分。它为社区提供了一种强大的方法来扩展 webpack 和开发 webpack 的编译过程。本文将尝试探索 webpack plugin，揭秘它的工作原理，以及如何开发一个 plugin。 通过插件我们可以扩展 web…

webpack 是我们现阶段要掌握的重要的打包工具之一，我们知道 webpack 会递归的构建依赖关系图，其中包含应用程序的每个模块，然后将这些模块打包成一个或者多个 bundle。 莫慌，我们一点点拆分开看，其实总体的文件就是一个 IIFE——立即执行函数。 函数的入参 mo…

因babel的版本从5升级到6有很多改动，比如babel本身不再提供任何transform的工作，都需要借助插件来完成，本文的所有讨论都是建立在babel 6之上的。如果只想看结论，直接跳到文章最后。 ---写在前面 ES6即ECMAScript 6，是前端开发的JS最新规范，…

在学习 Webpack 之前，我们需要了解一个概念：模块。 比如：我想在 C# 中进行数据库操作，我只需要在代码头部加上 下面这两段代码即可。 这两段代码可以看成 两个与数据库操作相关的模块。 当我们需求是数据库，或者是读取 IO 等其他操作，我们便加载其他不同的模块。 很明显…