前言 每次用vite创建项目秒建好，前几天用vue-cli创建了一个项目，足足等了我一分钟，那为什么用 vite 比 webpack 要快呢，这篇文章带你梳理清楚它们的原理及不同之处！文章有一点长，看

作者：滴滴公共前端团队 - J 基本用法 这个插件用来定义全局变量，在webpack打包的时候会对这些变量做替换。先看个例子 //webpack.config.js var webpack = require('webpack'); var path = require('pa…

模块化是一种主流的组织方式，它通过把我们的复杂代码按照功能的不同划分为不同的模块，单独的维护这种方式，提高我们的开发效率，降低维护成本。 模块化只是思想，不包含具体的实现。 自动采用严格模式，忽略use strict。 导出的成员并不是一个字面量对象，语法和字面量对象很像。导入…

Webpack5入门到精通: npm install webpack webpack-cli –g # 全局安装 npm install webpack webpack-cli –D # 局部安装

webpack分包 前言 一、多入口打包 二、提取公共模块 三、动态导入模块 四、魔法注释 前言 通过webpack实现前端项目整体模块化的优势固然很明显，但是它同样存在一些弊端，那就是我们项目中的所

Webpack 一直都是有些人的心魔，不清楚原理是什么，不知道怎么去配置，只会基本的 API 使用。它就像一个黑盒，让部分开发者对它望而生畏。 而本节最大的作用，就是帮大家一点一点的消灭心魔。

我们知道 Webpack 可以通过 DLL 或者 Externals 做代码共享时 Common Chunk，但不同应用和项目间这个任务就变得困难了，我们几乎无法在项目之间做到按需热插拔。 模块联邦是 Webpack5 新内置的一个重要功能，可以让跨应用间真正做到模块共享，所以…

打包体积优化！！！优化一半！！首次加载速度优化！！优化一半！！要让我们的项目fast fast fast！！

1. 给出一个实例，对比该案例webpack构建前后的差异，为后面分析构建主流程组铺垫 2. 分析运行时的执行逻辑。