Why image inside WEB-INF/classes is not displayed using ClassResource?

Good morning!

A question about the Book of Vaadin: in chapter 4.4.3. Class Loader Resources:

allows resources to be loaded from the class path using Java Class Loader. Normally, the relevant class path entry is the WEB-INF/classes folder under the web application, where the Java compilation should compile the Java classes and copy other files from the source tree.

The one-line example below loads an image resource from the application package and displays it in anImage component.


layout.addComponent(new Image(null, new ClassResource("smiley.jpg")));


So in this example the image
is used, am I right?

But, if so, why it doesn’t work in my code? This is it:

// Image as a class resource (i.e. inside WEB-INF/classes)

        Resource r = new ClassResource("image.png");

        layout.addComponent(new Image(null, r));


is an image inside WEB-INF/classes dir (I have created the classes dir inside WEB-INF and put the image.png image inside that directory), so it should work, but it doesn’t. Why?

The code would work once you export your project to a WAR, and deploy that WAR on Apache Tomcat.

Yes, I guess I have exported the project to the web application archive by selecting the project and clicking “Run as → Run on Server” and the project is deployed to the eclipse’s home/workspace/.metadata/.plugins/org.eclipse.wst.server.core/tmp0/wtpwebapps/my_project/ path and inside this path there’s the WEB-INF/classes directory with the image.png file, I have checked that.

And still I don’t see the image, what should I do?

No, you export the project by right-clicking the project and select the “export” option, and choose the war file.

Ok, thank you for the elucidation, I have tried what you are saying:
Export → WAR file
, saved the .war file inside Tomcat’s webapps dir, restarted Tomcat, checked Tomcat’s webapps/ folder and the project is there (un-wared), opened the browser, but yet I can’t see the image… How is that possible? Could it be something else?

hi Anton Bagdatyev …
i just read your post and donig some coding and push the result here …


and deploy it to openshift … here


please push the button to show the image …

put before you did any aother coding there is some issues you have to know …

#1 what is your project structure ?

if ( yourProjectStructure == maven ) {

you need to know how to add the resources folder or any other resource folder as you like
check this

and this

after you configure your resources folder (s) you need to know how ClassLoader work …
check this :

so what i did ?
i just add this line as button event :

button.addClickListener(e -> myImage.setSource(new ClassResource("../resources/myImage.png"))); look at the path … “…/resources/myImage.png”
why i point to parnet folder using “…” … i don’t know what i call them " maybe double dot’s" ?

screen shoot from my pc → look the atachment files

else if ( yourProjectStructure != maven ) {
maybe ant + ivy … ( create it with eclipse plugin ) …
you need to know ClassLoader refer to where is your main class is main class is where you define this code

@WebServlet(value = "/*", asyncSupported = true)
    @VaadinServletConfiguration(productionMode = false, ui = MyVaadinUI.class, widgetset = "core.AppWidgetSet")
    public static class Servlet extends VaadinServlet {

i’m sorry i can’t upload any picture cuz i use onely maven way with command line and text editor i haven’t any eclipse in my System.

( " if you find any thing n’t true … please tell me !") .


goodbye and i’m sorry i write a lot and i know my language is horrible


Hi Mohammed!

Thank you for your response, I am using Eclipse and Ivy as the dependency manager. I found a solution for this issue, please, check this post:

As Vikrant said, the app must be exported to a WAR archive and then deployed to the Tomcat server. Anyway, the image must be located in the same directory, where the compiled UI which uses it is located (in my case it was WEB-INF/classes/com/example/project).

ok … very good news … the thanks for you … both of you …

good luck !