效果图： ![](https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/7fb58f6899114511a813d9afccafb97f~tplv-k3u1fbpfcp-watermark.image)![](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/1007b1b204554094adccff079f9c3b78~tplv-k3u1fbpfcp-watermark.image) 引言：快速简单实现数据导出至Excel表需求。以下是具体操作步骤一、需要安装三个依赖： ```javascript npm install -S file-saver xlsx npm install -D script-loader 或者使用yarn相应安装 yarn add file-saver xlsx yarn add script-loader -D ``` 二、项目中新建一个文件夹：（vendor---表示第三方插件，可以另取合适的名称，我用的vendors）
里面放置两个文件`Blob.js`和 `Export2Excel.js`。下载地址： [文件下载](https://github.com/eliya123/tools/tree/master/%E5%AF%BC%E5%87%BAexcel) ![](https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/a0b444745aa24b2ea1602c21a02f81ce~tplv-k3u1fbpfcp-watermark.image) 三、修改`Export2Excel.js`内容
在`Export2Excel.js`中修改引入你自己的`Blob.js`文件的地址 ![](https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/4a048e131d2b40d69831b5868e8c5d09~tplv-k3u1fbpfcp-watermark.image) 注：如果不知道怎么配置路径
在build文件夹webpack.base.conf.js文件中resolve的alias加入(alias是配置别名)
`'@vendor': path.resolve(__dirname, '../src/vendor')`
即可解决（路径使用`require('@vendors/Blob.js')`即可）
![](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/4b9c9be6538e4aa0864d811f4cae353c~tplv-k3u1fbpfcp-watermark.image) 四、在Vue中引入 ```