聚合物3：ReferenceError：在Firefox上未定义define

Question

我正在将项目从Polymer 2手动转换为Polymer 3。 注意：我首先尝试了调制器，但没有成功（我在Windows，Linux和Mac中进行了多次尝试），所以我决定手动进行操作。这个问题与调制器无关（已经有很多讨论）。

该项目非常庞大，因此我正在逐步进行转换。我已经能够做一个基本的工作（将每个需要的元素转换成ES6类，等等）。

我正在使用聚合物服务测试它，所以还没有构建。

它也可以在Chrome和Chrome Canary中正常工作，并且加载速度非常快。在Firefox中，我得到了一个空白页，并且控制台中出现此错误： ReferenceError：定义未定义

到目前为止，我在网络上未发现有关此错误的任何信息，所以我决定向社区询问。

它停留在已加载元素的第一行。很抱歉，我无法提供太多代码，只是想知道它的卡住位置：

define(["../../node_modules/@polymer/polymer/polymer-element.js", 
...
...

在FF中以这种方式转换源代码的导入是否正确？ 在同一行中，所有模块导入都在一个数组中。

Chrome控制台中同一元素的第一行如下：

import { PolymerElement, html } from "../../node_modules/@polymer/polymer/polymer-element.js";

，然后是其他导入，就像在源代码中这样：

import { PolymerElement, html } from '@polymer/polymer/polymer-element.js';

我们非常感谢您的帮助。 谢谢！

经过几次测试后更新：

我注意到通过在带有createElement的脚本中添加模块来导入模块时，会发生此问题。

我尝试了一个新的Polymer 3项目（没有转换，只是他们在Polymer 3第一个元素中的演示）。

如果我这样包含模块（demo / index.html中的默认设置）：

<script type="module" src="demo-element.js"></script>

它在Chrome和Firefox中均可正常运行。

如果我改为以其他方式包含该模块：

<script>

  let script = document.createElement('script');
  script.setAttribute('type','module');
  script.setAttribute('src', 'demo-element.js');
  script.onload = function(){
    console.log('ready');
  };

  document.head.appendChild(script);

</script>

仅在Chrome中有效。 在Firefox中，它会给出相同的错误（未定义）：

我还尝试将侦听器添加到WebComponentsReady并在其后加载模块：

<script>

  window.addEventListener('WebComponentsReady', function(e) {
    console.log('components ready');

    let script = document.createElement('script');
    script.setAttribute('type','module');
    script.setAttribute('src', 'demo-element.js');
    script.onload = function(){
      console.log('ready');
    };

    document.head.appendChild(script);

  });

</script>

我在Firefox中遇到了相同的错误：

注意：同样的问题也在Edge中发生。这仅适用于Chrome。我没有在Safari中进行测试。

这时我有点卡住了。感谢您的帮助。