/* * @Author: Haijun Zhang * @Date: 2022-11-08 15:34:47 * @LastEditTime: 2022-11-15 17:51:22 * @LastEditors: Haijun Zhang * @Description: * @FilePath: \cmc-web\build\webpack.dll.config.js */ // webpack.dll.conf.js // 引入依赖 const path = require('path') const webpack = require('webpack') const { CleanWebpackPlugin } = require('clean-webpack-plugin') // 清空文件用的 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin // 压缩代码用的 module.exports = { mode: 'production', entry: { vendor: ['vue-router', 'vuex', '@vue/composition-api', 'axios', 'qs', 'js-cookie', 'dayjs', 'crypto-js', 'cmp-socket', 'vuedraggable'], element: ['cmp-element', 'cmp-echarts'] }, // 出口 output: { filename: 'dll.[name].js', // 其中[name]就是entry中的dll模块名字,因此filename就是dll.vue.js path: path.resolve(__dirname, '../dll'), // 输出打包的依赖文件到dll/js文件夹中 library: '[name]_library' // 暴露出的全局变量名,用于给 manifest 映射 }, plugins: [ // 重新打包时,清除之前打包的dll文件 new CleanWebpackPlugin({ cleanOnceBeforeBuildPatterns: [path.resolve(__dirname, '../dll/*')] // ** 代表文件夹, * 代表文件 }), // 生成 manifest.json 描述动态链接库包含了哪些内容 new webpack.DllPlugin({ // 暴露出的dll的函数名;此处需要和 output.library 的值一致 // 输出的manifest.json中的name值 name: '[name]_library', context: path.resolve(__dirname, '../'), // path 指定manifest.json文件的输出路径 path: path.resolve(__dirname, '../dll/[name]-manifest.json') // DllReferencePlugin使用该json文件来做映射依赖。(这个文件会告诉我们的哪些文件已经提取打包好了) }), new BundleAnalyzerPlugin() // 压缩 ] }