Question

我正在尝试在他们的演示应用中构建一个简单的侧边菜单。我看了他们的网络研讨会视频而不是主题。我的应用程序包含一个包含3个菜单项的菜单栏。创建菜单栏后，我添加了一个自定义样式，并根据valo-menubar的vaadin API定义了该对象。

尝试调试构建时出现以下错误

[ERROR] Failed to execute goal com.vaadin:vaadin-maven-plugin:8.0.5:compile-theme (default-cli) on project myapplication: Compiling theme "VAADIN\themes\mytheme" failed: Command [[

[ERROR] C:\Program Files\Java\jre1.8.0_121\bin\java -Xmx1G 
com.vaadin.sass.SassCompiler "path-to-styles.css"
"path-to-mytheme.scss"

[ERROR] ]] failed with status 1

[ERROR] -> [Help 1]

这是完整的错误日志

[INFO] Error stacktraces are turned on.
[INFO] Scanning for projects...
[INFO]                                                                         
[INFO] ------------------------------------------------------------------------
[INFO] Building myapplication 1.0-SNAPSHOT
[INFO] ------------------------------------------------------------------------
[INFO] 
[INFO] >>> jetty-maven-plugin:9.3.9.v20160517:run (default-cli) > test-compile @ myapplication >>>
[INFO] 
[INFO] --- vaadin-maven-plugin:8.0.5:update-theme (default) @ myapplication ---
[INFO] Updating theme VAADIN\themes\mytheme
[INFO] Widgetsets found from classpath:
[INFO] Addon styles found from classpath:
[INFO] 
[INFO] Search took 7ms
[INFO] Theme "VAADIN\themes\mytheme" updated
[INFO] 
[INFO] --- vaadin-maven-plugin:8.0.5:update-widgetset (default) @ myapplication ---
[WARNING] GWT plugin is configured to detect modules, but none were found.
[INFO] No widgetsets found - generating AppWidgetset if necessary.
[INFO] Updating widgetset AppWidgetset
[INFO] Adding resource directory to command classpath: C:\Users\Maddie\workspace\myapplication\src\main\resources
[INFO] Adding resource directory to command classpath: C:\Users\Maddie\workspace\myapplication\target\generated-resources\gwt
[INFO] Using com.vaadin:vaadin-client version 8.0.5
[INFO] Using com.vaadin:vaadin-client-compiler version 8.0.5
[INFO] Widgetsets found from classpath:
[INFO]  com.vaadin.DefaultWidgetSet in jar:file:C:/Users/Maddie/.m2/repository/com/vaadin/vaadin-client/8.0.5/vaadin-client-8.0.5.jar!/
[INFO] Addon styles found from classpath:
[INFO] 
[INFO] Search took 4ms
[INFO] 
[INFO] --- vaadin-maven-plugin:8.0.5:compile-theme (default) @ myapplication ---
[INFO] Updating theme VAADIN\themes\mytheme
[ERROR] Apr 15, 2017 9:04:13 PM com.vaadin.sass.internal.handler.SCSSErrorHandler severe
[ERROR] SEVERE: null
[ERROR] com.vaadin.sass.internal.parser.SCSSParseException: Error when parsing file mytheme.scss
[ERROR] Encountered "<EOF>" at line 82, column 2.
[ERROR] Was expecting one of:
[ERROR]     <S> ...
[ERROR]     "}" ...
[ERROR]     "+" ...
[ERROR]     "-" ...
[ERROR]     ">" ...
[ERROR]     "~" ...
[ERROR]     "[" ...
[ERROR]     "*" ...
[ERROR]     "%" ...
[ERROR]     "&" ...
[ERROR]     "." ...
[ERROR]     "and" ...
[ERROR]     "or" ...
[ERROR]     "not" ...
[ERROR]     ":" ...
[ERROR]     "#{" ...
[ERROR]     "through" ...
[ERROR]     "in" ...
[ERROR]     "@include" ...
[ERROR]     "@debug" ...
[ERROR]     "@warn" ...
[ERROR]     "@for" ...
[ERROR]     "@each" ...
[ERROR]     "@while" ...
[ERROR]     "@if" ...
[ERROR]     "@extend" ...
[ERROR]     "@content" ...
[ERROR]     <MICROSOFT_RULE> ...
[ERROR]     <IDENT> ...
[ERROR]     <VARIABLE> ...
[ERROR]     <HASH> ...
[ERROR]     "@media" ...
[ERROR]     "@page" ...
[ERROR]     "@font-face" ...
[ERROR]     <KEY_FRAME_SYM> ...
[ERROR]     <ATKEYWORD> ...
[ERROR]     
[ERROR]     at com.vaadin.sass.internal.ScssStylesheet.get(ScssStylesheet.java:176)
[ERROR]     at com.vaadin.sass.internal.visitor.ImportNodeHandler.traverse(ImportNodeHandler.java:68)
[ERROR]     at com.vaadin.sass.internal.tree.ImportNode.traverse(ImportNode.java:99)
[ERROR]     at com.vaadin.sass.internal.tree.Node.traverseChildren(Node.java:227)
[ERROR]     at com.vaadin.sass.internal.tree.Node.traverseChildren(Node.java:214)
[ERROR]     at com.vaadin.sass.internal.ScssStylesheet.traverse(ScssStylesheet.java:298)
[ERROR]     at com.vaadin.sass.internal.ScssStylesheet.compile(ScssStylesheet.java:267)
[ERROR]     at com.vaadin.sass.SassCompiler.main(SassCompiler.java:101)
[ERROR] 
[ERROR] Apr 15, 2017 9:04:13 PM com.vaadin.sass.internal.handler.SCSSErrorHandler severe
[ERROR] SEVERE: Mixin Definition: mytheme not found
[ERROR] Compiling theme "VAADIN\themes\mytheme" failed
org.codehaus.mojo.gwt.shell.JavaCommandException: Command [[
C:\Program Files\Java\jdk1.8.0_121\jre\bin\java -Xmx1G com.vaadin.sass.SassCompiler C:\Users\Maddie\workspace\myapplication\src\main\webapp\VAADIN\themes\mytheme\styles.scss C:\Users\Maddie\workspace\myapplication\src\main\webapp\VAADIN\themes\mytheme\styles.css
]] failed with status 1
    at org.codehaus.mojo.gwt.shell.JavaCommand.execute(JavaCommand.java:330)
    at com.vaadin.integration.maven.CompileThemeMojo.processTheme(CompileThemeMojo.java:65)
    at com.vaadin.integration.maven.AbstractThemeMojo.doExecute(AbstractThemeMojo.java:43)
    at org.codehaus.mojo.gwt.shell.AbstractGwtShellMojo.execute(AbstractGwtShellMojo.java:182)
    at org.apache.maven.plugin.DefaultBuildPluginManager.executeMojo(DefaultBuildPluginManager.java:134)
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:207)
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:153)
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:145)
    at org.apache.maven.lifecycle.internal.MojoExecutor.executeForkedExecutions(MojoExecutor.java:352)
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:197)
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:153)
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:145)
    at org.apache.maven.lifecycle.internal.LifecycleModuleBuilder.buildProject(LifecycleModuleBuilder.java:116)
    at org.apache.maven.lifecycle.internal.LifecycleModuleBuilder.buildProject(LifecycleModuleBuilder.java:80)
    at org.apache.maven.lifecycle.internal.builder.singlethreaded.SingleThreadedBuilder.build(SingleThreadedBuilder.java:51)
    at org.apache.maven.lifecycle.internal.LifecycleStarter.execute(LifecycleStarter.java:128)
    at org.apache.maven.DefaultMaven.doExecute(DefaultMaven.java:307)
    at org.apache.maven.DefaultMaven.doExecute(DefaultMaven.java:193)
    at org.apache.maven.DefaultMaven.execute(DefaultMaven.java:106)
    at org.apache.maven.cli.MavenCli.execute(MavenCli.java:863)
    at org.apache.maven.cli.MavenCli.doMain(MavenCli.java:288)
    at org.apache.maven.cli.MavenCli.main(MavenCli.java:199)
    at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
    at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
    at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
    at java.lang.reflect.Method.invoke(Method.java:498)
    at org.codehaus.plexus.classworlds.launcher.Launcher.launchEnhanced(Launcher.java:289)
    at org.codehaus.plexus.classworlds.launcher.Launcher.launch(Launcher.java:229)
    at org.codehaus.plexus.classworlds.launcher.Launcher.mainWithExitCode(Launcher.java:415)
    at org.codehaus.plexus.classworlds.launcher.Launcher.main(Launcher.java:356)
[INFO] ------------------------------------------------------------------------
[INFO] BUILD FAILURE
[INFO] ------------------------------------------------------------------------
[INFO] Total time: 3.269 s
[INFO] Finished at: 2017-04-15T21:04:13-05:00
[INFO] Final Memory: 14M/313M
[INFO] ------------------------------------------------------------------------
[ERROR] Failed to execute goal com.vaadin:vaadin-maven-plugin:8.0.5:compile-theme (default) on project myapplication: Compiling theme "VAADIN\themes\mytheme" failed: Command [[
[ERROR] C:\Program Files\Java\jdk1.8.0_121\jre\bin\java -Xmx1G com.vaadin.sass.SassCompiler C:\Users\Maddie\workspace\myapplication\src\main\webapp\VAADIN\themes\mytheme\styles.scss C:\Users\Maddie\workspace\myapplication\src\main\webapp\VAADIN\themes\mytheme\styles.css
[ERROR] ]] failed with status 1
[ERROR] -> [Help 1]
org.apache.maven.lifecycle.LifecycleExecutionException: Failed to execute goal com.vaadin:vaadin-maven-plugin:8.0.5:compile-theme (default) on project myapplication: Compiling theme "VAADIN\themes\mytheme" failed
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:212)
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:153)
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:145)
    at org.apache.maven.lifecycle.internal.MojoExecutor.executeForkedExecutions(MojoExecutor.java:352)
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:197)
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:153)
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:145)
    at org.apache.maven.lifecycle.internal.LifecycleModuleBuilder.buildProject(LifecycleModuleBuilder.java:116)
    at org.apache.maven.lifecycle.internal.LifecycleModuleBuilder.buildProject(LifecycleModuleBuilder.java:80)
    at org.apache.maven.lifecycle.internal.builder.singlethreaded.SingleThreadedBuilder.build(SingleThreadedBuilder.java:51)
    at org.apache.maven.lifecycle.internal.LifecycleStarter.execute(LifecycleStarter.java:128)
    at org.apache.maven.DefaultMaven.doExecute(DefaultMaven.java:307)
    at org.apache.maven.DefaultMaven.doExecute(DefaultMaven.java:193)
    at org.apache.maven.DefaultMaven.execute(DefaultMaven.java:106)
    at org.apache.maven.cli.MavenCli.execute(MavenCli.java:863)
    at org.apache.maven.cli.MavenCli.doMain(MavenCli.java:288)
    at org.apache.maven.cli.MavenCli.main(MavenCli.java:199)
    at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
    at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
    at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
    at java.lang.reflect.Method.invoke(Method.java:498)
    at org.codehaus.plexus.classworlds.launcher.Launcher.launchEnhanced(Launcher.java:289)
    at org.codehaus.plexus.classworlds.launcher.Launcher.launch(Launcher.java:229)
    at org.codehaus.plexus.classworlds.launcher.Launcher.mainWithExitCode(Launcher.java:415)
    at org.codehaus.plexus.classworlds.launcher.Launcher.main(Launcher.java:356)
Caused by: org.apache.maven.plugin.MojoExecutionException: Compiling theme "VAADIN\themes\mytheme" failed
    at com.vaadin.integration.maven.CompileThemeMojo.processTheme(CompileThemeMojo.java:69)
    at com.vaadin.integration.maven.AbstractThemeMojo.doExecute(AbstractThemeMojo.java:43)
    at org.codehaus.mojo.gwt.shell.AbstractGwtShellMojo.execute(AbstractGwtShellMojo.java:182)
    at org.apache.maven.plugin.DefaultBuildPluginManager.executeMojo(DefaultBuildPluginManager.java:134)
    at org.apache.maven.lifecycle.internal.MojoExecutor.execute(MojoExecutor.java:207)
    ... 24 more
Caused by: org.codehaus.mojo.gwt.shell.JavaCommandException: Command [[
C:\Program Files\Java\jdk1.8.0_121\jre\bin\java -Xmx1G com.vaadin.sass.SassCompiler C:\Users\Maddie\workspace\myapplication\src\main\webapp\VAADIN\themes\mytheme\styles.scss C:\Users\Maddie\workspace\myapplication\src\main\webapp\VAADIN\themes\mytheme\styles.css
]] failed with status 1
    at org.codehaus.mojo.gwt.shell.JavaCommand.execute(JavaCommand.java:330)
    at com.vaadin.integration.maven.CompileThemeMojo.processTheme(CompileThemeMojo.java:65)
    ... 28 more
[ERROR] 
[ERROR] Re-run Maven using the -X switch to enable full debug logging.
[ERROR] 
[ERROR] For more information about the errors and possible solutions, please read the following articles:
[ERROR] [Help 1] http://cwiki.apache.org/confluence/display/MAVEN/MojoExecutionException

mytheme.scss中是否存在语法错误？如果没有“v-menubar-custom”的定义，该程序运行正常。

MyUI.java

@Theme("mytheme")
public class MyUI extends UI {

private static final String CUSTOM = "custom";

@Override
protected void init(VaadinRequest vaadinRequest) {
    final VerticalLayout layout = new VerticalLayout();

    MenuBar nav = new MenuBar();

    MenuItem overview = nav.addItem("Overview", null, null);
    MenuItem clients = nav.addItem("Clients", null, null);
    MenuItem calendar = nav.addItem("Calendar", null, null);

    nav.addStyleName(CUSTOM);


    layout.addComponent(nav);

    setContent(layout);
}

@WebServlet(urlPatterns = "/*", name = "MyUIServlet", asyncSupported = true)
@VaadinServletConfiguration(ui = MyUI.class, productionMode = false)
public static class MyUIServlet extends VaadinServlet {
}
}

mytheme.scss

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

@mixin mytheme {
 @include valo;

.v-menubar-custom {
@include valo-menubar($primary-stylename: v-menubar, $include-additional-styles) {
    .#{$primary-stylename} {
        @include valo-button-static-style($states: normal focus disabled, $vertical-centering: false);
        @include valo-menubar-style;
    }
    .#{$primary-stylename}:activate:after {
        background: transparent;
    }
    .#{$primary-stylename} > .#{$primary-stylename}-menuitem {
        @include valo-menubar-menuitem-style;
    }
    .#{$primary-stylename} > .#{$primary-stylename}-menuitem-checked {
        @include valo-menubar-menuitem-checked-style;
    }

    .v-disabled > .#{$primary-stylename}-menuitem,
    .#{$primary-stylename} > .#{$primary-stylename}-menuitem-disabled {
        cursor: default;
    }

    &:before {
        display: none;
    }
}

.#{$primary-stylename}-menuitem-disabled {
    @include opacity($v-disabled-opacity);
}

.#{$primary-stylename} > .#{$primary-stylename}-menuitem-selected {
    @include valo-button-style($states: normal, $background-color: $v-selection-color, $border-radius: 0, $shadow: null, $unit-size: null, $font-weight: null);
    border-top-width: 0;
    border-left-width: 0;
    border-bottom-width: 0;
    z-index: 2;

    &:hover:before {
        background: none;
    }
}

.#{$primary-stylename} .#{$primary-stylename}-submenu-indicator {
    display: none;

    + .#{$primary-stylename}-menuitem-caption:after {
        font-family: FontAwesome;
        content: "\f078";
        font-size: 0.7em;
        vertical-align: .15em;
        margin: 0 -.2em 0 .5em;
        //IE filters are not supported on pseudo elements
        opacity: .5;
    }

    + .#{$primary-stylename}-menuitem-caption:empty:after {
        margin-left: -.2em;
    }
}

.#{$primary-stylename}-popup {
    @include valo-menubar-popup-style($primary-stylename)
}

@if $include-additional-styles {
    .#{$primary-stylename}-small {
        @include valo-menubar-style($background-color: null, $unit-size: $v-unit-size--small);
        font-size: $v-font-size--small;
    }

    .#{$primary-stylename}-borderless {
        @include-valo-menubar-borderless-style;
    }
}

}

Answer 1

您发布的SCSS存在多个问题，但我认为主要问题只是您不需要将整个valo-menubar mixin定义复制到@include语句中。您只需要mixin名称及其参数即可。因此，您的代码将简化为：

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

@mixin mytheme {
    @include valo;

    .v-menubar-custom {
        @include valo-menubar($primary-stylename: v-menubar, $include-additional-styles: false);
    }
}

但是，我不确定这是否是你想要的。鉴于您将样式名称“custom”应用于您的菜单栏，也许这对您有用：

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

@mixin mytheme {
    @include valo;

    @include valo-menubar($primary-stylename: v-menubar-custom, $include-additional-styles: false);
}

除此之外，mixin定义未正确复制。您最后缺少一个结束大括号，在最后一个@include语句后面有一个破折号，以及其他几个副本错误。有关详细信息，请参阅mixin documentation。

如果您想根据valo-menubar创建自定义mixin，则需要使用@mixin关键字（最好在mytheme mixin之外和单独的文件中）使用其他名称单独定义比valo-menubar，然后是@include，正如我在上面演示的那样。

希望这有帮助。

Valo主题编译错误

1 个答案: