首先我们install:
npm install jszip file-saver
而想要下载public的文件夹数据,首先我们要获取文件夹的结构:
const files = import.meta.glob("/public/**/*");
let filesPbulic = Object.keys(files);
获取到文件夹的结构以后,我们要做的就是获取到文件内容,然后把内容转换成zip插件需要的格式:
const downloadAllFiles = async () => { const zip = new JSZip(); const folderName = "fileName"; // 你要下载的文件夹名称 let filesStructurePbulic = Object.keys(files); // 遍历文件列表,获取文件内容并添加到 zip 中 const promises = []; filesChild.forEach((item) => {
//此处是获取文件内容的方法,我使用axios来获取 const promise = getFile(item).then((data) => { let fileName = item.slice(item.lastIndexOf("/") + 1); //获取文件名
//要将文件内容转换为blob格式zip才能识别 const blob = new Blob([data], { type: "application/json" }); zip.file(fileName, blob, { binary: true }); //逐个添加文件 }); promises.push(promise); }); Promise.all(promises) .then(() => { zip.generateAsync({ type: "blob" }).then((content) => { saveAs(content, "myFiles.zip"); }); }) .catch((err) => { console.log("文件压缩失败"); });};
获取文件内容的方法:
const getFile = (url) => { return new Promise((resolve, reject) => { axios({ url: url, method: "get", }).then((res) => { resolve(res.data); }); });};
注意:获取.ts文件的时候会报错,我们可以先把ts文件改为其他后缀,然后在zip.file的时候把文件名中的后缀给改回来就可以了!