你遇到过那些 Webpack 的打包问题?
约 528 字大约 2 分钟
2025-03-15
遇到的打包报错主要集中在以下几类问题上
1、依赖下载超时
具体原因: 项目使用了一些内部镜像库没有的包,回源 到 NPM 的时候超时了
解决方案: 将依赖包压缩上传到 Git 仓库,使用Git LFS大文件存储
管理,构建不再执行安装命令,直接使用tar
命令去解压依赖包
2、构建服务器的环境版本导致的版本兼容性问题
具体原因: 云龙流水线上派发构建任务时是随机指定一台服务器去执行构建任务,这些服务器上安装的 Node.js 版本可能不一样。下载依赖包的时候,版本可能会被 Node.js 的版本影响,导致下载下来的依赖包和其他依赖包冲突。
解决方案: 在构建脚本中指定运行环境的版本,后来发现流水线失败的概率没有明显改善。将依赖包压缩上传到 Git 仓库,使用Git LFS大文件存储
管理,构建不再执行安装命令,直接使用tar
命令去解压依赖包,顺利解决该问题
3、ESlint 语法报错
具体原因: 历史遗留、增量检查
解决方案: 手动配置相关 Rule,IDE 插件 ESLint 检查,提交代码前检查。
4、Canvas 贴图导致的跨域问题
具体原因: AUI
脚手架在打包的时候,内置的插件会将一些资源如图片自动上传到第三方静态资源服务器,从而导致代码中的图片引用变成了一个第三方服务器的 URL 地址,和当前域名不一致,导致 Canvas 在贴图的时候包跨域问题。
解决方案: 查阅官方文档,可以在根目录下创建一个static
文件夹,将图片放进去,这样AUI
在构建的时候,会自动忽略,直接将该图片打包到结果中。
更新日志
2025/8/24 08:17
查看所有更新日志
e7112
-1于