使用DllPlugin将稳定依赖提前打包成独立文件可显著提升构建速度，尤其适用于中大型项目；需配置dll专用Webpack文件、执行一次打包生成dll文件与manifest.json，并在主配置中通过DllReferencePlugin引用及HTML中注入script标签。
直接用 DllPlugin 把稳定依赖（比如 React、Vue、Lodash、Antd 这类几乎不改版本的库）提前打包成独立文件，后续日常构建就跳过它们的解析、编译、优化全过程——这是见效最明显的提速手段之一，尤其适合中大型项目。
第一步：单独建一个 dll 配置文件
新建 webpack.config.dll.js（或类似命名），只写第三方依赖入口和输出规则：
- entry 中列出所有“万年不变”的包，例如
['react', 'react-dom', 'lodash', 'antd'] - output 设置
filename: 'dll/[name].dll.js'和library: '_dll_[name]'（名字要和插件里一致） - plugins 加
new webpack.DllPlugin({ path: './dist/dll/manifest.json', name: '_dll_vendor' })
第二步：运行一次 dll 打包
在 package.json 的 scripts 里加一条命令：
"build:dll": "webpack --config webpack.config.dll.js"- 执行
npm run build:dll后，会生成dll/vendor.dll.js和dll/manifest.json - 这个过程只需做一次，除非你升级了这些依赖的版本才需要重跑
第三步：主配置里引用 dll 结果
在你日常用的 webpack.config.js（或 vue.config.js / webpack.base.conf.js）里加两处：
- plugins 加
new webpack.DllReferencePlugin({ manifest: require('./dist/dll/manifest.json') }) - 确保 HTML 模板里有
<script src="./dll/vendor.dll.js"></script>（可用 html-webpack-plugin 插件自动注入） - clean-webpack-plugin 要排除 dll 目录，避免每次清空时删掉已打包好的 dll 文件
注意几个实际容易卡住的点
Dll 不是开箱即用，踩坑多集中在细节：
- manifest.json 路径必须是 Node 可 require 的绝对路径，不能写相对路径或动态拼接
- dll.js 暴露的全局变量名（
library）和 DllPlugin 的name必须严格一致 - HMR 环境下 dll 不生效，它只加速生产构建（
npm run build）或测试环境打包（如npm run testbuild） - git 忽略
dll/目录和manifest.json，避免提交二进制产物
