Angular CLI-从优化中排除软件包

Question

在Angular 6应用程序中，我们使用了预构建的React应用程序来渲染一些内部组件。 React app的编译版本作为节点模块安装。

当我使用ng serve在开发模式下运行代码时，一切都按预期运行。

但是，当我在--prod中构建应用程序时，React组件的行为开始有所不同。出现一些奇怪的渲染问题。

我正在试验angular-cli设置，并且意识到，如果我禁用optimization（“ optimization”：false），问题就消失了。但是束的大小变大了2倍。

这些是我尝试过的设置。以及相应的结果：

optimization: false, buildOptimizer: true, vendorChunk: false - 33.3mb (works good)
optimization: true, buildOptimizer: false, vendorChunk: false - 17mb (not working)
optimization: true, buildOptimizer: false, vendorChunk: true - 17mb (not working)

当Angular尝试优化React模块时，似乎会出现问题。

我认为最好对除React应用程序模块以外的所有项目启用优化。以某种方式将React应用程序模块从优化管道中排除，如果可能的话，可以将其捆绑在一个单独的块中。

有人可以提出解决方案吗？或有任何猜测为什么会这样？

Answer 1

好吧，由于我们尚未设法找到更好的解决方案（因此），我们决定保留所有构建设置。相反，我们将已编译的main.js库中的React脚本添加到angular.json build.scripts数组中。这样，Angular构建系统会将这个库作为<script>添加到index.html中。该基于反应的库被编译为UMD模块。因此，我们可以从全局范围（window.<libraryName>）中访问它。

然后，我们从代码中删除了React库的所有导入。现在，Angular构建过程完全忽略了该库，仅将未修改的源添加为单独的脚本。

现在一切正常。