Javascript 用于从CDN导入的代码拆分块的网页包设置

我们正在开发一个React组件库。一些组件需要更新，而无需重新部署主机应用程序代码。这与Google Maps library非常相似，在Google Maps library中，客户端API是一个小的shell代码，它在运行时导入实际的Maps代码，从而允许在没有主机停机的情况下进行热更新。 所以我们计划将这个库的输出分成两部分-

Shell组件库，任何主机应用程序代码都将使用它从中导入Shell组件。例如

import Notifications from 'our-shell-lib';
render(){
    return <Notifications .../>;
}

从“我们的shell库”导入通知；
render（）{
返回；
}

我们计划在服务器上托管的核心组件库。我们将继续用新的补丁和功能更新它

在上面的示例中，Notifications组件将从我们的服务器下载NotificationsCore组件并在内部装载它

我们已经能够导出单个shell组件，并且它在运行时正确地下载相应的核心组件，使用所描述的基于web的技术

但是，当核心组件使用动态导入时，这会导致代码分裂。所有的核心组件文件都可以在远程服务器上使用，但是我们没有成功地将它们打包成具有动态导入功能的核心组件可以以与服务器URL无关的方式从远程服务器加载其拆分块我们不想在核心捆绑包中硬编码publicpath。我们可以在运行时将服务器路径传递给核心组件，以帮助它找到其动态导入，但还没有找到这样做的方法

---

想法

很抱歉回复太晚了

我们能够通过使用解决这个问题。在发布这个问题时，关于这个整洁的小特性的文档很少。它允许您设置webpack垫片（包含在每个webpack捆绑包中）用于解析相对导入的公共路径

---

因此，我们在核心库中导出了一个瘦包装函数，shell组件可以调用该函数来设置从导入核心库的任何CDN的公共路径。

因此，如果您可以在运行时传递服务器路径，它将解决所有问题？是的，请参阅下面的答案。