隔离 WebComponent JS 库
Isolate WebComponent JS libraries
我们有主要的大型应用程序，打算使用不同的库（Angular、React 等）创建单独的小型应用程序（微服务），并将它们编译成 webcomponent 以便在任何地方使用它们。主应用程序有一些库（示例 underscore.js），我们的一些组件使用相同的库（示例 lodash.js），在这种情况下，我们在主应用程序中使用 webcomponents 时会看到很多冲突。您对我们如何隔离 webcomponent 库以及它们可以在隔离模式下工作有什么想法吗？我们也用过 ShadowDOM，但运气不好。
隔离模式 没有随 Web 组件 技术一起提供。所有导入的库将共享相同的命名空间。
Shadow DOM 不是关于 Javascript 代码隔离，而是只处理 DOM 和 CSS 隔离.
如果您想解决与导入的第 3 方库的冲突，您可以：
将您的网站设计为仅在全局依赖脚本中导入一次第 3 方导入。
使用将为您管理库加载的模块加载器，例如 require.js，或内置功能 ES6 模块 import 功能，甚至是你自己的 Vanilla 模块加载器。
使用 <iframe> 元素隔离您网站的不同部分（如果可能，但您可能会丢失一些交互功能）。
所有这些解决方案都有优点和缺点。这取决于您的需求。
我们有主要的大型应用程序，打算使用不同的库（Angular、React 等）创建单独的小型应用程序（微服务），并将它们编译成 webcomponent 以便在任何地方使用它们。主应用程序有一些库（示例 underscore.js），我们的一些组件使用相同的库（示例 lodash.js），在这种情况下，我们在主应用程序中使用 webcomponents 时会看到很多冲突。您对我们如何隔离 webcomponent 库以及它们可以在隔离模式下工作有什么想法吗？我们也用过 ShadowDOM，但运气不好。
隔离模式 没有随 Web 组件 技术一起提供。所有导入的库将共享相同的命名空间。
Shadow DOM 不是关于 Javascript 代码隔离，而是只处理 DOM 和 CSS 隔离.
如果您想解决与导入的第 3 方库的冲突，您可以：
将您的网站设计为仅在全局依赖脚本中导入一次第 3 方导入。
使用将为您管理库加载的模块加载器，例如 require.js，或内置功能 ES6 模块
import功能，甚至是你自己的 Vanilla 模块加载器。使用
<iframe>元素隔离您网站的不同部分（如果可能，但您可能会丢失一些交互功能）。
所有这些解决方案都有优点和缺点。这取决于您的需求。