lit 包中缺少装饰说明符答案

【问题标题】：Missing decorators specifier in lit packagelit 包中缺少装饰说明符
【发布时间】：2023-02-24 07:03:35
【问题描述】：

我已经通过 npm 安装了 lit 包，然后我用我自己的 .ts 文件替换了 my-element.ts 文件，并用新的 .ts 文件更新了 package.json 文件

`从 "lit" 导入 { LitElement,html,css }; import { customElement, property } from "lit/decorators";

@customElement('sample_project') 导出类 SampleProject 扩展 LitElement { 静态样式 = cssp {color:blue};

@property()
name = 'Intro';

render(){
    return html`<p>Hello, ${this.name}!</p>`;
}

我尝试使用 npm run dev 在本地主机上运行该组件，我收到一条错误消息，指出它在 'lit' 包中缺少 ./decorators 说明符，但很奇怪，因为我已经安装了 web dev 服务器 npm 来尝试解决该问题。

期待它运行并仅呈现 Hello 介绍，非常基本

【问题讨论】：

【解决方案1】：

好像你安装的lit包里找不到decorators目录，所以Vite报错路径不存在。

手动仔细检查 ./node_modules/lit/decorators 是否存在。如果是，请尝试使用完整目录路径提供导入。

【讨论】：

【解决方案2】：

您需要指定扩展名。

import { customElement, property } from "lit/decorators.js";

包导出是用 package.json https://github.com/lit/lit/blob/b0c3f82ef0f97326a205e77e7e1043b75a5cc53f/packages/lit/package.json#L28 中的 .js 扩展名定义的，因此它必须与要解析的模块匹配。

【讨论】：