由于业务上有一个需求,需要每次将webpack输出的文件再打一个zip包,但是找了找没有找到合适的插件,于是自己写了一个。
API:
class:MultiZipPlugin
new MultiZipPlugin(options);
options: [{
entrys: [], // webpack打包完毕后,需要打入zip包的文件名数组
zipName: "", // zip包的名
}]
下面给出一段vue-cli3的vue.config.js配置(不清楚为什么vue这里要多包一层数组)
let multiZipPlugin = require("./src/plugin/multi-zip-plugin/index");
let pages = {
page1: {
entry: 'src/main.js',
// 模板来源
template: 'public/index.html',
// 在 dist/index.html 的输出
filename: 'page1.html',
},
page2: {
entry: 'src/main_1.js',
// 模板来源
template: 'public/index.html',
// 在 dist/index.html 的输出
filename: 'page2.html',
}
}
//不清楚为什么vue这里要多包一层数组
let configs = [];
let options = [];
for (let page in pages){
let option = {
entrys: ["js", page + ".html"],
zipName: page,
zipPath: "",
}
options.push(option);
}
configs.push(options);
module.exports = {
pages: pages,
lintOnSave: false,
chainWebpack: config => {
config.plugin('multi-zip-plugin')
.use(multiZipPlugin, configs);
}
}