在 lit-element 中重用组件答案

【问题标题】：Reusing a component in lit-element在 lit-element 中重用组件
【发布时间】：2021-01-01 21:01:30
【问题描述】：

任何可以指向任何关于如何在 lit-element 中重用代码的文档的人。

现在的问题是，如果我声明一个元素，在我的例子中是 close-button，并且我想通过将它导入 2 个或更多 lit-elements 来重用它，那么浏览器中将会出现关于 @987654323 的错误@ 被多次声明。

很好理解，但是我如何重用一个组件，我当然可以将按钮移动到一个单独的文件并将其添加到文档中，但是其他组件需要依赖它才能工作。

任何建议

【问题讨论】：

您可以将您的元素放在像 npm 这样的 repo 站点上，并使用您的 package.json 加载它。如果您不想使用 npm，您可以安装类似 Nexus Repository OSS 3.0 (sonatype.com/nexus/repository-oss) 并管理您自己的存储库（这就是我所做的）。
我明白了，但是你实际上会依赖于你的组件之外的东西，这是你不想要的东西。我猜

【解决方案1】：

如果close-button 自行注册，并调用customElements.define('close-button', ...)，那么您应该能够导入其定义模块，并且不会因 JS 的模块缓存行为而出现任何错误。

您必须有多个 customElements.define('close-button', ...) 调用，所以我要确保 1) 它是自注册的，并且您不会在使用它的每个组件中再次注册它，以及 2) 您正在使用标准 JS 模块.

【讨论】：

【解决方案2】：

在进行了更多调查后，我得出结论，共享 HTML 模板可能是一种方法。

【讨论】：