How to write a Vaadin theme I can include in my ot

问题:

I'm trying to create a simple theme (using Chameleon and some custom css and images, etc), which I've done.

The problem is I want to wrap it up in a maven project and reference from other Vaadin projects as a dependency, so I can theme all my Vaadin apps the same way - or even better have it as a dependency of the parent project so that the whole app gets styled the same way and I can re-skin it for different customers.

I'm not sure how to package and deploy the theme project so that it will be usable from the other projects? Should I make it into a war project - but then how do the other projects 'get at it'? They'll be looking for the themes under their own VAADIN/themes directories - rather than copying it there (somehow), how could I just have them reference one single copy?

回答1:

I've had the same problem. I solved it by using war overlays.

I have a base theme in the parent project which is extended in clients' configuration projects. The configuration project simply uses the war as a runtime dependency and the parent project's files are overlaid, as explained here.

Just add the dependency in the client's project:

<dependency>
    <groupId>com.mygroup</groupId>
    <artifactId>my-parent-project</artifactId>
    <version>1.0.0-SNAPSHOT</version>
    <type>war</type>
    <scope>runtime</scope>
</dependency>

and import the parent project's styles in the client's theme's styles.css file:

@import "../parent-theme/styles.css"

and add the client's styles.

If you need to use the classes of the parent project, you can set the attachClasses property true in the maven-war-plugin configuration and also attach the sources by using maven-source-plugin if you need them for debugging:

<plugin>
    <artifactId>maven-war-plugin</artifactId>
    <version>2.1.1</version>
    <configuration>
        <attachClasses>true</attachClasses>
    </configuration>
</plugin>

<plugin>
    <groupId>org.apache.maven.plugins</groupId>
    <artifactId>maven-source-plugin</artifactId>
    <version>2.1.2</version>
    <executions>
        <execution>
            <id>attach-sources</id>
            <goals>
                <goal>jar</goal>
            </goals>
        </execution>
    </executions>
    <configuration>
        <attach>true</attach>
    </configuration>
</plugin>

and include them in your client's project:

<dependency>
    <groupId>com.mygroup</groupId>
    <artifactId>my-parent-project</artifactId>
    <version>1.0.0-SNAPSHOT</version>
    <classifier>classes</classifier>
    <type>jar</type>
    <scope>compile</scope>
</dependency>

回答2:

I think I've found a way - not sure it's the best way because it copies the theme css into multiple war projects rather than creating one shared instance but the only other way would be to do some clever server configuration to share a url across projects or something.

http://www.ensor.cc/2011/06/mavens-war-overlay-what-are-war.html