在Angular 5中使用Webpack从CDN加载JS文件

Question

我正在为其中一个项目使用Angular 5 + Webpack。 现在，我想从CDN用JS文件（包括延迟加载的.chunks.js文件）加载所有资产。

对于CSS和图像，我已经改变了publicPath中的选项webpack所以我能够从CDN加载CSS和图像，但问题是JS文件。

对于JS文件，我已经更改了<base href="{{CDN-PATH-HARE}}">但它给了我这个错误

我也尝试过使用webpack重命名JS文件，但是这种技巧也没有用。

我只是想知道我是朝着正确的方向前进还是应该以不同的方式思考。

谢谢。

Answer 1

我认为“进行摇树时使用CDN”的讨论可能是一个相当复杂的讨论...

该答案假定中断仅在切换到CDN时发生，否则将正确提供您的应用程序。 您确定您的应用正在投放吗？

历史API由角度使用，但由于来源不同，因此将其视为安全问题。

假设CDN中的外部可缓存库应包含在捆绑中，则可以尝试下面列出的几个选项。 我将首先重新考虑该假设。 Webpack的要点是先进行树状交换，然后再进行捆绑，因此，我将确保您确信捆绑已经缓存并捆绑在CDN上的文件的好处。

如果确定要采用此方法，则可以做几件事。 您可以在角度路由器上使用hashlocationstrategy：

imports [
RouterModule.forRoot(routes, {useHash: true})
]

或者，您可以在构建应用程序时完全使用节点的http服务器托管应用程序，并在应用程序的index.html中使用主机baseUrl进行播放。

最后，如果这些都不适合您，您可以尝试使用htaccess文件或进行一些手动路由，但是我发现这些方法有些脆弱。

在SO上有几个预先存在的问题可以解决此问题，但我认为CDN的起伏值得重新回应。

也许更好的答案是问这个问题：如果您的库从未更改，并且您的应用程序具有版本更新，为什么要强迫用户重新下载您的库？