前端在做表格导出功能时,因考虑到表格样式可修改问题,一般会使用到xlsx、xlsx-style等插件,但是由于插件多年没人维护,导致出现很多不兼容性等问题。前前后后处理很多报错问题,而其中 jszip not a constructor 报错是我个人认为最为麻烦的,版本降至0.10.0也不好使。
通过上网查阅多篇文章,最后总结分享有效的解决方法之一:
vue项目通过命令:“npm i node-polyfill-webpack-plugin -D” 安装Webpack 插件。
然后在vue.config.js文件配置如下:
const NodePolyfillPlugin = require("node-polyfill-webpack-plugin")
module.exports = defineConfig({
configureWebpack: {
plugins: [
new NodePolyfillPlugin()
]
}
})
记住,修改了vue.config文件后一定要保存并重启项目,否则当前代码效果无效。
Tip:我们在 Webpack 配置文件中引入了 node-polyfill-webpack-plugin,并将其作为插件添加到了 plugins 数组中。这样,在打包过程中,插件会自动将 Node.js 的核心模块和全局变量添加到浏览器环境中,使得你可以在浏览器中使用这些功能。