jsZip将多个文件压缩成一个压缩包

在项目开发中,搭档大佬要做一个断点续传的功能,让我帮忙研究一下前端将多个文件压缩成一个压缩包的方法,所以就有了这篇文章。

我的demo是写在vue中的,所以首先要有一个vue环境,才能进行接下来的步骤。那么下面我们就开始吧。

1.cmd搭建一个vuex项目,简单分为以下两个步骤,具体可参考:参考地址

        (1)npm install --global vue-cli

        (2)vue init webpack demo

2.在vue项目中安装jszip需要用到的相关插件

        (1)npm install jszip

jsZip将多个文件压缩成一个压缩包_第1张图片

         (2)npm install file-saver

jsZip将多个文件压缩成一个压缩包_第2张图片

        (3)npm install axios   

jsZip将多个文件压缩成一个压缩包_第3张图片

3.在代码中引入组件 

import axios from 'axios'
import JSZip from 'jszip'
// eslint-disable-next-line no-unused-vars
import FileSaver from 'file-saver'

 4.download.vue组件完整代码:



 5.代码结构如下:

jsZip将多个文件压缩成一个压缩包_第4张图片

6.实现结构如下:

jsZip将多个文件压缩成一个压缩包_第5张图片

 7.参考地址:

参考1

参考2

你可能感兴趣的:(jsZip,jsZip,jsZip打包,jsZip下载压缩包,vue搭建jsZip,vue实现下载压缩包)