vaadin - Vaadin 自定义 CSS

Question

我对使用 Vaadin 的自定义 CSS 有疑问。如果我在 MainUI.java 文件中声明以下内容，一切正常：

@Theme("valo")
@SpringUI
public class MainUI extends UI {
...

如果我添加我的新主题，它不会被拾取。在 Eclipse 的项目文件夹中，我执行了：Project->New->Other->Vaadin Theme

之后，我的 MainUI.java 文件中有：

@Theme("myCustomTheme")
@SpringUI
public class MainUI extends UI {
...

刷新页面后，我只看到纯文本：/

我的模板文件：

@import "../valo/valo.scss";

@mixin myCustomTheme {
  @include valo;

  // Insert your own theme rules here
}

我应该怎么做才能拥有一个基于 Valo 的主题，我可以在其中更改一些 CSS 规则？

Answer 1

您需要 Vaadin Maven 插件：

<plugin>
    <groupId>com.vaadin</groupId>
    <artifactId>vaadin-maven-plugin</artifactId>
    <version>${vaadin.version}</version>
    <executions>
        <execution>
            <goals>
                <goal>update-theme</goal>
                <goal>update-widgetset</goal>
                <goal>compile</goal>
                <!-- Comment out compile-theme goal to use on-the-fly theme compilation -->
                <goal>compile-theme</goal>
            </goals>
        </execution>
    </executions>
</plugin>

然后，您可以在 Eclipse 中单击此按钮：