什么是DLL文件？
DLL(Dynamic Link Library)文件为动态链接库文件,在Windows中，许多应用程序并不是一个完整的可执行文件，它们被分割成一些相对独立的动态链接库，即DLL文件，放置于系统中。当我们执行某一个程序时，相应的DLL文件就会被调用。
为什么要在项目中使用Dll？
通常来说，我们的代码都可以至少简单区分成业务代码和第三方库。如果不做处理，每次构建时都需要把所有的代码重新构建一次，耗费大量的时间。然后大部分情况下，很多第三方库的代码并不会发生变更（除非是版本升级），这时就可以用到dll：把复用性较高的第三方模块打包到动态链接库中，在不升级这些库的情况下，动态库不需要重新打包，每次构建只重新打包业务代码。
Dllplugin的使用
使用dll时，可以把构建过程分成dll构建过程和主构建过程（实质也就是如此），所以需要两个构建配置文件，例如叫做webpack.config.js和webpack.dll.config.js。
我们可以通过配置DllPlugin来提高webpack的打包速度。
1. 在项目目录下新建 webpack.config.dll.js ，这个文件用来打包引用的公共包。
const path = require('path');
const webpack = require('webpack');
const DllPlugin = require('webpack/lib/DllPlugin');
module.exports = {
entry: {
vendor: ['react', 'react-dom', 'react-router']
},
resolve: {
alias: {
'react': path.resolve(__dirname, '../node_modules/react/cjs/react.production.min.js'),
'react-dom': path.resolve(__dirname, '../node_modules/react-dom/cjs/react-dom.production.min.js'),
'react-router': path.resolve(__dirname, '../node_modules/react-router/umd/react-router.min.js'),
}
},
output: {
path: path.resolve(__dirname, '../public/static/lib'),
filename: '[name].js',
library: '[name]'
},
devtool: 'inline-source-map',
plugins: [
new webpack.DefinePlugin({
'process.env': {
'NODE_ENV': JSON.stringify('production')
}
}),
new DllPlugin({
filename: '[name].js',
name: '[name]',
path: path.resolve(__dirname, '../public/static/lib', '[name].manifest.json'), //描述生成的manifest文件
}),
new webpack
.optimize
.UglifyJsPlugin({
compress: {
warnings: false, //删除无用代码时不输出警告
drop_console: true, //删除所有console语句，可以兼容IE
collapse_vars: true, //内嵌已定义但只使用一次的变量
reduce_vars: true, //提取使用多次但没定义的静态值到变量
},
output: {
beautify: false, //最紧凑的输出，不保留空格和制表符
comments: false, //删除所有注释
}
})
]
}
2. 在package.json 中的 script 加入 "dll": "node_modules/.bin/webpack --config config/webpack.config.dll.js"指令。
3. 执行npm run dll，会在/public/static/lib这个目录下生产一个vendor.js
4.然后在webpack配置文件中引用：
const manifest = require('../public/static/dll/vendor.manifest.json');
...
plugins: [
new webpack.DllReferencePlugin({
manifest
}),
]
5.在html文件中引入打包的文件
<script src="/static/lib/vendor.js"></script>
