Share same CSS among different modules

[Kiev Gama]

Hello,

I'm splitting my application in several different modules and would like to use the same stylesheet since the CSS classes will be reused.
Is there a way to use the same CSS file for different modules ? I'm trying to avoid replication of the CSS file.

Thanks in advance,

Kiev

[Dan Morrill]

Hi, Kiev!

The easiest way to do this is to create a common module that the two modules inherit.  You would put the CSS in the parent, and include it from both the child modules.

Here is an example.  Suppose you have two modules: com.company.apps.foo.Foo and com.company.apps.bar.Bar.  These would have the following Java source tree:

src/
    com/
        company/
            apps/
                foo/
                    Foo.gwt.xml
                    client/Foo.java
                    public/Foo.html
                bar/
                    Bar.gwt.xml
                    client/Bar.java
                    public/Bar.html

You want to put "company.css" somewhere where it is available to both.  To do this, you might create a new directory: like src/com/company/apps/public/ and then put your company.css file in there.  You would then need to create a GWT module for Foo and Bar to inherit from.  Your new tree would look like this:

src/
    com/
        company/
            apps/
                public/company.css
                Common.gwt.xml
                foo/
                    Foo.gwt.xml
                    client/Foo.java
                    public/Foo.html
                bar/
                    Bar.gwt.xml
                    client/Bar.java
                    public/Bar.html

Common.gwt.xml would look something like this:
<module>
<inherits name="com.google.gwt.user.User"/>
<public path="public"/>
</module>

Then you would add a line like this to Foo.gwt.xml and Bar.gwt.xml:
<inherits name="com.company.apps.Common"/>

This will cause Foo and Bar to inherit all the settings from Common.  The particular setting you are interested in will be the 'public' directory from Common, which contains your shared CSS file.

Give that a try, and see if it works for you!  Hope that helps,

- Dan Morrill

[Jason Essington]

but then don't forget to add
<stylesheet src="company.css" />

to your Common.gwt.xml file, or no one will have css :-)

-jason

[Kiev Gama]

Thanks guys.
It worked alright.

Regards,

Kiev

[STB Land]

It don't seems to work with GWT 2.4.0

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE module PUBLIC "-//Google Inc.//DTD Google Web Toolkit 2.4//EN"
        "http://google-web-toolkit.googlecode.com/svn/releases/2.4/distro-source/core/src/gwt-module.dtd">
<module rename-to='testjquerymobile'>
...
<public path="public" />
<stylesheet src="jquery.mobile-1.0.1.min.css" />
<script src="jquery-1.7.1.min.js" />
<script src="jquery.mobile-1.0.1.min.js" />
...
</module>

00:00:00,144 [WARN] 404 - GET /testjquerymobile/jquery-1.7.1.min.js (127.0.0.1) 1422 bytes
00:00:00,161 [WARN] 404 - GET /testjquerymobile/jquery.mobile-1.0.1.min.js (127.0.0.1) 1429 bytes
00:00:00,280 [WARN] 404 - GET /testjquerymobile/jquery.mobile-1.0.1.min.css (127.0.0.1) 1430 bytes