1

polymer-serve使用简单的静态 Web 服务器没有什么魔力?

我刚从一个简单的“hello world”项目开始。当我运行时polymer serve,我可以浏览到http://localhost:8000/example.html的页面,并且效果很好。如果我使用static-server并浏览到同一页面,我会在 Chrome 中收到一条错误消息。

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

这是 example.html,它是直接从README中复制出来的。

<script src="node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
<script type="module">
  import { LitElement, html } from "@polymer/lit-element";

  class MyElement extends LitElement {
    static get properties() {
      return {
        mood: { type: String }
      };
    }

    constructor() {
      super();
      this.mood = "happy";
    }

    render() {
      return html`
        <style>
          .mood {
            color: green;
          }
        </style>
        Web Components are <span class="mood">${this.mood}</span>!
      `;
    }
  }

  customElements.define("my-element", MyElement);
</script>

<my-element mood="happy"></my-element>

4

1 回答 1

2

模块是按名称而不是按路径导入的

例如检查这个参考

从中

这一变化使 Polymer 与标准 npm 实践保持一致,并使 Polymer 更容易与其他工具和项目集成。但是,由于浏览器还不支持按名称导入模块,这意味着您需要一个转换步骤才能在浏览器中本地运行 Polymer 模块。Polymer CLI 和相关工具正在更新以自动执行此转换。

运行聚合物构建应创建转换后的文件(由路径引用)

于 2019-01-03T20:54:02.193 回答