在 Vaadin 14 中调用 NPM 包的函数时出现 ReferenceError

Question

我想为我的一个 .js 文件导入一个模块，然后 用 Vaadin 14 调用我的 .js 文件。不幸的是，我很难导入它，并且在浏览器中抛出了 ReferenceError。

我的看法：

@Route(value = "jstest", layout = MainView.class)
@PageTitle("jstest")
@JsModule("./sipcall.js")
@NpmPackage(value = "sip.js", version = "0.15.10")
public class SipJsTest extends Div {
    private Button b;
    public SipJsTest() {
        b = new Button();
        b.setText("Execute SIP.js");
        b.addClickListener(listener -> {
            Page page = UI.getCurrent().getPage();
            page.executeJs("executesipcall()");
        });
        add(b);
    }
}

sipcall.js（模块是这样命名的）位于frontend/sipcall.js/。如果我做一个简单的控制台输出，函数就会被正确调用。如果我尝试使用导入的模块，就会出现错误。

sipcall.js:

import "sip.js";

window.executesipcall = function() {
    var ua = new SIP.UA(...) // from the imported module, throws exception
}

node_modules/sip.js/ 包含我用 @NpmPackage 导入的模块。该模块也在 package.json 和 "sip.js": "0.15.10".

中列出

网络控制台错误：

client-4FB121A4CC0177A1068809F06428A755.cache.js:57 Uncaught ReferenceError: SIP is not defined at window.executesipcall (vaadin-bundle-6b322b28264dafdccb46.cache.js:4505) at Object.eval (eval at St (client-4FB121A4CC0177A1068809F06428A755.cache.js:991), :1:1)

知道为什么 Vaadin 无法识别导入吗？是因为它没有在全局范围内导入（提到here）吗？

Answer 1

我找到了解决办法。我不得不使用 NodeJs 的 require() 而不是 import 来导入模块。它有效，但我不确定为什么。

sipcall.js:

window.executesipcall = function() {
    var sip = require("sip.js");
    var ua = new sip.UA(...)
}

What is require()?

在 Vaadin 14 中调用 NPM 包的函数时出现 ReferenceError

ReferenceError if calling function of NPM package in Vaadin 14

javascript

java

vaadin

npm

vaadin14