webpack篇之四(AutoDllPlugin插件)

夏祯
2023-12-01

一、前言

上一篇介绍了DllPlugin和DllReferencePlugin两个插件把引用的第三方库打包成动态库,但是动态库引用需要通过手动添加至index.html中。
AutoDllPlugin插件就是来解决这个问题,通过AutoDllPlugin HtmlWebpackPlugin,这两个插件一起使用,因为它可以节省手动将DLL包添加到自己的HTML中。

二、安装

通过package-lock.json,确认webpack的版本。

  1. 如果是webpack4以下的版本:如下命令安装:
npm install --save-dev autodll-webpack-plugin@0.3
  1. 如果是webpack4版本的话,如下命令安装:
npm install --save-dev autodll-webpack-plugin

三、配置

   new AutoDllPlugin({
        inject: true,
        filename: '[name]_[hash].js',        
        entry: {
          echarts222: [
            'echarts'
            // .... 更多插件
          ]
        }
      }),

四、总体执行

  1. 先执行生成dll文件
"build:dll": "webpack --config webpack.dll.config.js"

说明:生成dll动态库,并生成manifest.json

  1. 再执行build
 类似资料: