1

我实际上只是想获得一个简单的带有 lit-element 的 Polymer 3 应用程序来工作。在 VS Code 中，我运行了 polymer serve，当我导航到 localhost:8081 到我的 index.html 时，我在 F12 工具中收到错误消息：

未捕获的类型错误：无法解析模块说明符“@polymer/polymer/lib/mixins/properties-mixin.js”。相对引用必须以“/”、“./”或“../”开头。

这非常令人沮丧，我已经尝试解决这个问题很长一段时间了。

在 HTML 中，我只是按预期包含文件：

 <!DOCTYPE html>

<html lang="en">
    <head>
        <title>Test Polymer 3</title>
        <script type="module" src="./node_modules/@polymer/lit-element/lit-element.js"></script>        
        <script type="module" src="./MyApp.js"></script>
    </head>
    <body>

        <my-app score='5'></my-app>
    </body>
</html>

在我的自定义元素的 JavaScript 文件中，我正在执行以下操作：

import {LitElement, html} from './node_modules/@polymer/lit-element/lit-element.js';

class MyApp extends LitElement {
    constructor() {
        super();
    }//end ctor

    static get properties() {
        return {
            score: Number
        }
    }//end properties

    //no get template needed.  Use _render instead
    _render({score}) {
        return html`The score is ${score}`;  //equivalent {{score}} or [[score]]
    }//end _render    window.customElements.define(MyApp.is, MyApp);  

    static get is() {
        return 'my-app';
    }//end is

}//end class

window.customElements.define(MyApp.is(), MyApp);

任何帮助将不胜感激。我对一些 Web 组件技术非常陌生。我使用 HTML5、CSS3、JavaScript、jQuery 等已经有很长时间了，但是这种对 Web 组件和 Polymer 3 的新推动就像是一种完全不同的动物，我在掌握工作流程的某些方面时遇到了困难。

4

0 回答 0