CSS file issue + possible bug in GWT 1.7

18 views
Skip to first unread message

grasshopper

unread,
Nov 4, 2009, 1:46:22 PM11/4/09
to Google Web Toolkit
Hello all,

I've just migrated a GWT 1.5 project to GWT 1.7.1. One of the issues i
ran into was that in hosted mode my css file was not getting picked
up. Searching through the GWT group i learned that i would need to
add the following line to my gwt.xml file:
<stylesheet src="/index.css" /> and this made my css styles get picked
up in hosted mode. However, once i was able to compile the project,
build a war, and deploy the war to a tomcat instance, when i would
navigate to app url i would run into the css styles not getting picked
again. In my index.html file, the entry point to my app, i also have
the following:
<link type="text/css" rel="stylesheet" href="index.css">

Two things to notice between what's in index.gwt.xml and index.html:
in index.gwt.xml there is a forward slash, and it needs to be there or
else the css styles will not get picked up. In index.html there is no
forward slash, and it should be that way because that file reference
should be relative to the app url.

Ultimately, i figured out why is my css file not getting picked up in
tomcat. My appname.noncache.js file refers to href="/index.css" which
i am assuming it's getting during compiling from index.gwt.xml.

Is there a way for Compiler not to reference "/index.css" from gwt.xml
file??

Anyone else run into issues with CSS file in GWT 1.7.1???

Yozons Support on Gmail

unread,
Nov 4, 2009, 3:46:30 PM11/4/09
to google-we...@googlegroups.com
I've reported this issue, too.  It seems odd, but if you don't put a full path, it assumes it's in the generated javascript area, but that area is blown away during each compile, so it's not clear where to define the CSS in Eclipse so that after the compile it puts the CSS back in there.  If you put the slash, then it's rooted at the /, not the webapp's context path.  Frustrating, but don't know the solution other than to keep it in the HTML file where it works as expected, though doesn't follow the "module" model of ensuring the CSS is kept with the module.

Open eSignForms

unread,
Nov 4, 2009, 4:08:19 PM11/4/09
to Google Web Toolkit
I've seen re-read the modules description and figured out what I
needed to do, at least in Eclipse, and then to use the default names
GWT recognizes.

In the project root where your gwt.xml file is, you should have a
'client' folder where your client code goes that will be converted to
javascript, a 'server' folder where you server-side Java code goes,
and a 'public' folder (which I didn't have before) where you can put
the CSS referenced in your gwt.xml file without the leading /. Now
when I do a GWT Compile, the css files in my public folder are copied
into the war's module folder where it will automatically look for it,
so it no longer needs to be in the HTML host document.

Hope that helps you, too.

grasshopper

unread,
Nov 4, 2009, 4:40:45 PM11/4/09
to Google Web Toolkit
I just tried placing the css file in public on the same dir as the
gwt.xml, but that causes other problems....if you are referring to
images from css file. It also then, starts to look like a GWT 1.5
project :-)

Yozons Support on Gmail

unread,
Nov 4, 2009, 5:10:52 PM11/4/09
to google-we...@googlegroups.com
I only started with GWT 1.7, so I can't speak about that.  But here's what I have in my gwt.xml:

  <!-- Specify public resources that will be copied to the module -->
  <public path="public/common"></public>
  <public path="public/login"></public>

  <!-- Style sheets we use from the public paths above              -->
  <stylesheet src="esf.css"/>
  <stylesheet src="login.css"/>

So, when my module loads, it will insert the link tags to pull in "esf.css" and "login.css" from the 'module path' generated by the GWT Compiler.  Because my project has multiple gwt.xml files, I segmented the public area into a 'public/common' for our base styles used in all modules, and another 'public/login' for just the login module.  Then I can reference both CSS files using simple stylesheet entries in the gwt.xml file.

What I found is that my module (<module rename-to='esfgwt_login'>) folder war/esfgwt_login not only contains the javascript, but it also has a copy of the CSS.  I guess you can also put images and javascript files in the public area if you want them to be automatically included, but for me, that's a bit more rare since we don't have much javascript/images that we share (we're using image bundles for most images) which have their own scheme.
Reply all
Reply to author
Forward
0 new messages