首页 > 解决方案 > 如何在 npm install 上定义自定义元素

问题描述

我想尝试使用我使用带有 npm 的 vanilla javascript 制作的自定义 Web 组件。所以我将它发布到 npm 以将其导入到我正在研究的另一个学习项目中。我的问题是我的环境无法识别自定义元素。

我的 package.json 将 main 定义为“index.js”文件。该文件使用标准 customElements.define 定义了组件。当我想使用这个元素时,它似乎没有注册。

我目前的黑客解决方法是

class CustomElement { ... }
function defineCustomElement() { 
  customElements.define('tag-name', CustomElement)
}
export default defineCustomElement

不过,这感觉就像一个可怕的黑客攻击。当我四处搜索时,我没有看到提到我的问题,也找不到任何好的信息,所以我可能遗漏了一些关于我应该搜索/查看的内容。

我的目标是,只需将组件定义为 package.json 中的依赖项,它就会自动定义。

有人可以帮忙吗?

标签: javascriptnpmcustom-element

解决方案


推荐阅读