如何跨 Web 组件共享库
How to share libraries across web components
我已经利用自定义元素启动了一个微前端项目。
我正在寻找一种在应用程序的所有部分之间共享依赖关系的方法。
我想知道如何使用 Material-ui 库来做到这一点。
例如，可以将库附加到 window 对象并从自定义元素（Web 组件）内部访问它。
我在这里看到的问题是 material-ui 作为 npm 模块存在，我还没有找到通过 [=10 加载它的选项=] 标签。
自定义元素通过
http import
这意味着它们将在 window 对象被 material-ui 库填充之前加载。
我找到了一种共享库的方法，例如 UI 库，例如 Material-UI，那就是将它们放在全局范围内（window 对象）。
然后被包含在合成层中的 web component (custom element) 可以从从包含它的上下文继承的 window 对象中读取它。
在只需要功能的情况下，可以轻松使用此方法。如果是UI库，也有style，需要注意web组件上的shadow dom是否开启，开启关闭。
原因是 Web 组件的影子 dom 样式范围界定功能，这意味着可以简单地从父项继承样式。
这是我去年制作的一个快速示例，现在我又让它工作了:) github.com/mnemanja/web-components-composition
我已经利用自定义元素启动了一个微前端项目。 我正在寻找一种在应用程序的所有部分之间共享依赖关系的方法。
我想知道如何使用 Material-ui 库来做到这一点。 例如，可以将库附加到 window 对象并从自定义元素（Web 组件）内部访问它。
我在这里看到的问题是 material-ui 作为 npm 模块存在，我还没有找到通过 [=10 加载它的选项=] 标签。
自定义元素通过
http import window 对象被 material-ui 库填充之前加载。
我找到了一种共享库的方法，例如 UI 库，例如 Material-UI，那就是将它们放在全局范围内（window 对象）。
然后被包含在合成层中的 web component (custom element) 可以从从包含它的上下文继承的 window 对象中读取它。
在只需要功能的情况下，可以轻松使用此方法。如果是UI库，也有style，需要注意web组件上的shadow dom是否开启，开启关闭。
原因是 Web 组件的影子 dom 样式范围界定功能，这意味着可以简单地从父项继承样式。
这是我去年制作的一个快速示例，现在我又让它工作了:) github.com/mnemanja/web-components-composition