如何添加大于 100 MB 的 SPFX 包？答案

【问题标题】：How to add SPFX package larger than 100 MB?如何添加大于 100 MB 的 SPFX 包？
【发布时间】：2019-04-08 14:45:53
【问题描述】：

我正在使用 React JS 为 SharePoint 在线开发一个 SPFX 应用程序（SharePoint 框架）。一切都很好，直到我的应用程序大小超过 100 MB。现在，虽然我可以将应用程序上传到我的应用程序目录网站，但我无法更新我的网站集中的应用程序。当我尝试时，我收到以下错误：

包流超过了允许的最大长度'104857600'字节

我正在使用 Gulp Bundle -ship 和 Gulp package-solution --ship 命令来打包我的解决方案。有没有更有效的生产包装方式？也许是一种包文件不会变得那么大的方法？

【问题讨论】：

您在该应用中添加了什么？ 100 MB 的大小太疯狂了！

标签： reactjs sharepoint sharepoint-online sharepoint-apps spfx

【解决方案1】：

经过几个小时的尝试和尝试，找到了解决问题的解决方案。原始问题的答案仍然未知，即我还没有找到如何添加大于 100 MB 的应用程序。但我找到了解决方案，为什么应用程序首先超过 100 MB。分享它，以便它可以帮助像我这样开始使用 React SPFX 开发的其他人。

问题

我的项目的媒体文件绝对为零（没有图像，没有视频）。所以令人困惑的是，这个包超过了 100 MB。不过，我有超过 25 个组件和 5 个 Web 部件。我通常启动我的工作台（使用 Gulp Serve）并继续进行更改，直到它准备好构建。然后我停止 Gulp Serve 并运行我的构建命令（Gulp Bundle -ship & Gulp Package-Solution --Ship）。它的作用是在每次构建时增加 .sppkg 文件的大小。它还增加了将应用程序上传和检查到应用程序商店的痛苦延迟（在最坏的情况下几乎 10 分钟）。然后，当包超过 100 MB 时，您将无法再在您的网站集中更新它。

解决方案

我偶然发现了“Gulp Clean”，并想试一试。我在构建命令之前运行了它，瞧！几分钟前的 100 MB 包现在是 1.3 MB（显然，因为我的解决方案包含的所有文件都是 .ts、.tsx 和 .scss 文件）。现在在应用商店中更新我的应用只需不到一分钟。

所以我每次需要时都创建了一个 bat 文件来构建我的包。 bat文件内容如下图：

call gulp clean
call gulp bundle -ship
call gulp package-solution --ship

其他参考

我发现this post from Waldek Mastykarz 太晚了。虽然在他的帖子中使用“清洁”的原因与我的不同，但如果我早点看到这个，它会为我节省几个小时。

警告

我仍在详细发现 Gulp Clean，不能确定它是否没有副作用。

【讨论】：