Vaadin 23 JavaScript 导入问题

我有一个Java类，它扩展了Vaadin Div类，它应该是一个Cookie警告弹出窗口(实现尚未完成):

//imports

@CssImport("css/info_popup.css")
@JsModule("js/script.js")
@Tag("info_popup")
public class CookiesDiv extends Div {

    public CookiesDiv() {
        this.setId("info_popup");

        Span span = new Span("By continuing to this site, you accept the EULA and the cookies. ");
        span.add(new Anchor("./info", "Learn more"));
        this.add(span);

        this.add(new Button("GOT IT", event -> {
            Page page = UI.getCurrent().getPage();
            this.getId().ifPresent(id -> page.executeJs("fadeOut('" + id + "')"));
        }));
    }
}

当按下‘GET IT’按钮时，就会调用一个用‘script.js’编写的JS函数，该函数为div设置动画，然后将其从页面中删除:

window.fadeOut = function(target) {
    target.style = 'animation: fade-out 0.5s ease-out 0s forwards'
    setTimeout(function() {
        target.style = 'display: none'
    }, 500)
}

我的问题是:文件已成功导入，但当我测试该按钮时，浏览器控制台抛出以下错误:"unautReferenceError:FdeOut is not fined".

我在一些论坛上看到，在Vaadin 14中，将function fadeOut(target) {}个作品更改为window.fadeOut = function(target) {}个作品，但感觉没有什么变化.

这是我的主树:

main
├───java
│   └───com
│       └───Achille004
│           └───FreeTransfer
│               ├───backend
│               │   ├───database
│               │   ├───handlers
│               │   └───security
│               └───frontend
│                   ├───css
│                   ├───js
│                   ├───pages
│                   └───views
└───resources
    ├───META-INF
    │   └───resources
    │       └───img
    ├───static
    └───templates

Java位于页面中，而css和js模块位于各自的文件夹中.

我在网上找不到其他东西，所以我只是迷路了.有人知道怎么修吗？

附注:我不知道它是否会有帮助:css文件中的大多数礼仪都被忽略了，但我仍然需要做一些研究.