Where do CSS and JavaScript files go in a Maven web app project?

Question

I am switching to use Maven for my Spring web app projects and I am running into a simple issue. I am not sure where to put the CSS and JS files in the new project structure.

Traditional Web App Structure

In a traditional Java web app structure (In Eclipse, created as a Dynamic Web Project) I put the CSS, Javascript and Images files under the following structure

WebContent
|__css/myStyles.css
|__js/myjs.js
|__images/myImage.gif
|__WEB-INF

Then in my jsp if I want to reference a CSS file I do as follows:

<link rel="stylesheet" href="<%=request.getContextPath()%>/css/myStyles.css">

This works fine.

Maven Web App Structure

In a Maven project I have put the css files in these locations:

First Attempt

Under the webapp folder at the same level as WEB-INF just like in a traditional dynamic web project. But when I do the following

mvn clean tomcat:run

I get the following error from the Spring Framework:

org.springframework.web.servlet.PageNotFound - No mapping found for HTTP request with URI [/appname/css/myStyles.css] in DispatcherServlet

Second Attempt

Placed my css folder under src/main/resources But when I do the following:

mvn clean tomcat:run

I get the following error from the Spring Framework:

org.springframework.web.servlet.PageNotFound - No mapping found for HTTP request with URI [/appname/css/myStyles.css] in DispatcherServlet

Third Attempt

Placed my css folder src/main/resources

Results: Same as above

I am sure it's something simple but I am stuck, maybe I am overlooking something.

UPDATE: Adding pom.xml to see if it can help troubleshoot the issue:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.dariopardo</groupId>
<artifactId>jfreechartdemo</artifactId>
<name>abc</name>
<packaging>war</packaging>
<version>1.0.0-BUILD-SNAPSHOT</version>
<properties>
    <java-version>1.6</java-version>
    <org.springframework-version>3.0.6.RELEASE</org.springframework-version>
    <org.aspectj-version>1.6.9</org.aspectj-version>
    <org.slf4j-version>1.5.10</org.slf4j-version>
</properties>
<repositories>
    <repository>
        <id>spring-maven-release</id>
        <name>Spring Maven Release Repository</name>
        <url>http://maven.springframework.org/release</url>
    </repository>
    <repository>
        <id>spring-maven-milestone</id>
        <name>Spring Maven Milestone Repository</name>
        <url>http://maven.springframework.org/milestone</url>
    </repository>
    <repository>
        <id>spring-roo-repository</id>
        <name>Spring Roo Repository</name>
        <url>http://spring-roo-repository.springsource.org/release</url>
    </repository>
    <repository>
        <id>JBoss Repo</id>
        <url>https://repository.jboss.org/nexus/content/repositories/releases</url>
        <name>JBoss Repo</name>
    </repository>
</repositories>
<pluginRepositories>
    <pluginRepository>
        <id>spring-maven-release</id>
        <name>Spring Maven Release Repository</name>
        <url>http://maven.springframework.org/release</url>
    </pluginRepository>
    <pluginRepository>
        <id>spring-maven-milestone</id>
        <name>Spring Maven Milestone Repository</name>
        <url>http://maven.springframework.org/milestone</url>
    </pluginRepository>
    <pluginRepository>
        <id>spring-roo-repository</id>
        <name>Spring Roo Repository</name>
        <url>http://spring-roo-repository.springsource.org/release</url>
    </pluginRepository>
</pluginRepositories>
<dependencies>
    <!-- Spring -->
    <dependency>
        <groupId>org.springframework</groupId>
        <artifactId>spring-context</artifactId>
        <version>${org.springframework-version}</version>
        <exclusions>
            <!-- Exclude Commons Logging in favor of SLF4j -->
            <exclusion>
                <groupId>commons-logging</groupId>
                <artifactId>commons-logging</artifactId>
             </exclusion>
        </exclusions>
    </dependency>
    <dependency>
        <groupId>org.springframework</groupId>
        <artifactId>spring-core</artifactId>
        <version>${org.springframework-version}</version>
        <exclusions>
            <exclusion>
                <groupId>commons-logging</groupId>
                <artifactId>commons-logging</artifactId>
            </exclusion>
        </exclusions>
    </dependency>
    <dependency>
        <groupId>org.springframework</groupId>
        <artifactId>spring-test</artifactId>
        <version>${org.springframework-version}</version>
        <scope>test</scope>
        <exclusions>
            <exclusion>
                <groupId>commons-logging</groupId>
                <artifactId>commons-logging</artifactId>
            </exclusion>
        </exclusions>
    </dependency>
    <dependency>
        <groupId>org.springframework</groupId>
        <artifactId>spring-aop</artifactId>
        <version>${org.springframework-version}</version>
    </dependency>
    <dependency>
        <groupId>org.springframework</groupId>
        <artifactId>spring-aspects</artifactId>
        <version>${org.springframework-version}</version>
    </dependency>
    <dependency>
        <groupId>org.springframework</groupId>
        <artifactId>spring-tx</artifactId>
        <version>${org.springframework-version}</version>
    </dependency>
    <dependency>
        <groupId>org.springframework</groupId>
        <artifactId>spring-jdbc</artifactId>
        <version>${org.springframework-version}</version>
        <classifier />
    </dependency>
    <dependency>
        <groupId>org.springframework</groupId>
        <artifactId>spring-orm</artifactId>
        <version>${org.springframework-version}</version>
        <classifier />
    </dependency>
    <dependency>
        <groupId>commons-pool</groupId>
        <artifactId>commons-pool</artifactId>
        <version>1.5.4</version>
        <classifier />
        <exclusions>
            <exclusion>
                <groupId>commons-logging</groupId>
                <artifactId>commons-logging</artifactId>
            </exclusion>
        </exclusions>
    </dependency>
    <dependency>
        <groupId>commons-dbcp</groupId>
        <artifactId>commons-dbcp</artifactId>
        <version>1.3</version>
        <classifier />
        <exclusions>
            <exclusion>
                <groupId>commons-logging</groupId>
                <artifactId>commons-logging</artifactId>
            </exclusion>
            <exclusion>
                <groupId>commons-pool</groupId>
                <artifactId>commons-pool</artifactId>
            </exclusion>
            <exclusion>
                <groupId>xerces</groupId>
                <artifactId>xerces</artifactId>
            </exclusion>
            <exclusion>
                <groupId>xerces</groupId>
                <artifactId>xercesImpl</artifactId>
            </exclusion>
            <exclusion>
                <groupId>xml-apis</groupId>
                <artifactId>xml-apis</artifactId>
            </exclusion>
        </exclusions>
    </dependency>
    <dependency>
        <groupId>org.springframework</groupId>
        <artifactId>spring-web</artifactId>
        <version>${org.springframework-version}</version>
        <classifier />
        <exclusions>
            <exclusion>
                <groupId>commons-logging</groupId>
                <artifactId>commons-logging</artifactId>
            </exclusion>
        </exclusions>
    </dependency>
    <dependency>
        <groupId>org.springframework</groupId>
        <artifactId>spring-webmvc</artifactId>
        <version>${org.springframework-version}</version>
    </dependency>
            
    <!-- AspectJ -->
    <dependency>
        <groupId>org.aspectj</groupId>
        <artifactId>aspectjrt</artifactId>
        <version>${org.aspectj-version}</version>
    </dependency>   
    
    <!-- Hibernate -->
    <dependency>
        <groupId>org.hibernate</groupId>
        <artifactId>hibernate-core</artifactId>
        <version>3.6.4.Final</version>
        <classifier />
    </dependency>
    <dependency>
        <groupId>org.hibernate</groupId>
        <artifactId>hibernate-entitymanager</artifactId>
        <version>3.6.4.Final</version>
        <classifier />
        <exclusions>
            <exclusion>
                <groupId>cglib</groupId>
                <artifactId>cglib</artifactId>
            </exclusion>
            <exclusion>
                <groupId>dom4j</groupId>
                <artifactId>dom4j</artifactId>
            </exclusion>
        </exclusions>
    </dependency>
    <dependency>
        <groupId>org.hibernate.javax.persistence</groupId>
        <artifactId>hibernate-jpa-2.0-api</artifactId>
        <version>1.0.0.Final</version>
        <classifier />
    </dependency>
    <dependency>
        <groupId>org.hibernate</groupId>
        <artifactId>hibernate-validator</artifactId>
        <version>4.1.0.Final</version>
        <classifier />
        <exclusions>
            <exclusion>
                <groupId>javax.xml.bind</groupId>
                <artifactId>jaxb-api</artifactId>
            </exclusion>
            <exclusion>
                <groupId>com.sun.xml.bind</groupId>
                <artifactId>jaxb-impl</artifactId>
            </exclusion>
        </exclusions>
    </dependency>
    <dependency>
        <groupId>javax.validation</groupId>
        <artifactId>validation-api</artifactId>
        <version>1.0.0.GA</version>
        <classifier />
    </dependency>
    <dependency>
        <groupId>cglib</groupId>
        <artifactId>cglib-nodep</artifactId>
        <version>2.2</version>
        <classifier />
    </dependency>
    <dependency>
        <groupId>javax.transaction</groupId>
        <artifactId>jta</artifactId>
        <version>1.1</version>
        <classifier />
    </dependency>
    
    <!-- Logging -->
    <dependency>
        <groupId>org.slf4j</groupId>
        <artifactId>slf4j-api</artifactId>
        <version>${org.slf4j-version}</version>
    </dependency>
    <dependency>
        <groupId>org.slf4j</groupId>
        <artifactId>jcl-over-slf4j</artifactId>
        <version>${org.slf4j-version}</version>
        <scope>runtime</scope>
    </dependency>
    <dependency>
        <groupId>org.slf4j</groupId>
        <artifactId>slf4j-log4j12</artifactId>
        <version>${org.slf4j-version}</version>
        <scope>runtime</scope>
    </dependency>
    <dependency>
        <groupId>log4j</groupId>
        <artifactId>log4j</artifactId>
        <version>1.2.15</version>
        <exclusions>
            <exclusion>
                <groupId>javax.mail</groupId>
                <artifactId>mail</artifactId>
            </exclusion>
            <exclusion>
                <groupId>javax.jms</groupId>
                <artifactId>jms</artifactId>
            </exclusion>
            <exclusion>
                <groupId>com.sun.jdmk</groupId>
                <artifactId>jmxtools</artifactId>
            </exclusion>
            <exclusion>
                <groupId>com.sun.jmx</groupId>
                <artifactId>jmxri</artifactId>
            </exclusion>
        </exclusions>
        <scope>runtime</scope>
    </dependency>

    <!-- @Inject -->
    <dependency>
        <groupId>javax.inject</groupId>
        <artifactId>javax.inject</artifactId>
        <version>1</version>
    </dependency>
            
    <!-- Servlet -->
    <dependency>
        <groupId>javax.servlet</groupId>
        <artifactId>servlet-api</artifactId>
        <version>2.5</version>
        <scope>provided</scope>
    </dependency>
    <dependency>
        <groupId>javax.servlet.jsp</groupId>
        <artifactId>jsp-api</artifactId>
        <version>2.1</version>
        <scope>provided</scope>
    </dependency>
    <dependency>
        <groupId>javax.servlet</groupId>
        <artifactId>jstl</artifactId>
        <version>1.2</version>
    </dependency>

    <!-- Test -->
    <dependency>
        <groupId>junit</groupId>
        <artifactId>junit</artifactId>
        <version>4.7</version>
        <scope>test</scope>
    </dependency>       
    
    <!-- To bring jfree chart in, iText & Apache POI -->
    <dependency>
        <groupId>net.sf.jasperreports</groupId>
        <artifactId>jasperreports</artifactId>
        <version>4.1.2</version>
    </dependency> 
    
    <dependency>
        <groupId>org.codehaus.groovy</groupId>
        <artifactId>groovy-all</artifactId>
        <version>1.5.5</version>
    </dependency>
    
    <!-- Oracle jdbc drivers -->
    <dependency>
        <groupId>com.oracle</groupId>
        <artifactId>oracle</artifactId>
        <version>10.2.0.1.0</version>
    </dependency>
    
</dependencies>
<build>
    <plugins>
        <plugin>
            <groupId>org.apache.maven.plugins</groupId>
            <artifactId>maven-compiler-plugin</artifactId>
            <configuration>
                <source>${java-version}</source>
                <target>${java-version}</target>
            </configuration>
        </plugin>
        <plugin>
            <groupId>org.apache.maven.plugins</groupId>
            <artifactId>maven-war-plugin</artifactId>
            <configuration>
                <warName>abc</warName>
            </configuration>                            
        </plugin>
        <plugin>
            <groupId>org.apache.maven.plugins</groupId>
            <artifactId>maven-dependency-plugin</artifactId>
            <executions>
                <execution>
                    <id>install</id>
                    <phase>install</phase>
                    <goals>
                        <goal>sources</goal>
                    </goals>
                </execution>
            </executions>
        </plugin>           
    </plugins>
</build>

**UPDATE: Adding Web.xml**

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">

<!-- The definition of the Root Spring Container shared by all Servlets and Filters -->
<context-param>
    <param-name>contextConfigLocation</param-name>
    <param-value>/WEB-INF/spring/root-context.xml
                 classpath*:META-INF/spring/applicationContext*.xml                  
    </param-value>
</context-param>

<!-- Creates the Spring Container shared by all Servlets and Filters -->
<listener>
    <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>

<!-- Processes application requests -->
<servlet>
    <servlet-name>appServlet</servlet-name>
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
    <init-param>
        <param-name>contextConfigLocation</param-name>
        <param-value>/WEB-INF/spring/appServlet/servlet-context.xml</param-value>
    </init-param>
    <load-on-startup>1</load-on-startup>
</servlet>
    
<servlet-mapping>
    <servlet-name>appServlet</servlet-name>
    <url-pattern>/</url-pattern>
</servlet-mapping>

Could you show the pom.xml? BTW, you could just compare .war file produced with the good one which you built before. — kan
– kan, Commented Oct 20, 2011 at 14:08
updated with POM.xml as you suggested. If I do a maven install it generates a war file and it does put the css in there appropriately. But If i do a mvn tomcat:run for rapid development the css files do not seem to make it over the target directory or wherever they need to be so that the application knows about them — Viriato
– Viriato, Commented Oct 20, 2011 at 17:18
I have changed my command to mvn clean war:exploded tomcat:run but that did not work either. How do people run their Maven Java web apps from the IDE without having to create a an actual war and deploying the war to the app server? — Viriato
– Viriato, Commented Oct 20, 2011 at 18:31
Never used tomcat from maven. I could recommend jetty:run - works great, and I think it should work faster. Also, IDE usually provide web server integration for rapid development, it doesn't require run maven, hence works faster. — kan
– kan, Commented Oct 20, 2011 at 19:11
I am doing what you suggest now Right Clicking on the project and doing a Run As .../ Run On Server but my css keeps not being applied for some reason. If I have my home.jsp under webapp/WEB-INF/views and my css under webapp/css/styles.css what should my href path look like? <link rel="stylesheet" href=""> — Viriato
– Viriato, Commented Oct 20, 2011 at 19:46

Viriato · Accepted Answer · 2011-10-24 14:41:21Z

44

So if you have your DispatcherServlet configured in a REST like URL pattern such as / then css files would go under src/main/webapp/resources

Just to clarify this is what I had to do:

Make sure that in your servlet-context.xml you have as follows:

<resources mapping="/resources/**" location="/resources/" />

Create a folder if does not already exist under webapps called resources
Place your css folder along with css files there

Reference my css file as follows:

<link rel="stylesheet" href="<%=request.getContextPath()%>/resources/css/960.css"/>

answered Oct 24, 2011 at 14:41

Viriato

3,0219 gold badges43 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Capricorn1 Over a year ago

I know this is quite old, but if you are using the JSTL core taglib as in: <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> you can also use: <link rel="stylesheet" href="<c:url value='/resources/css/dspo-common.css'/>"/>

Raja Anbazhagan · Accepted Answer · 2016-01-08 19:31:52Z

16

I was faced with the same question in a maven project. There seems to be no good answer to my problem. So I did a simple experiment and it worked perfectly.

This is a simple maven project, I have the following directory structure: (Irrelevant directories are not shown)

───src
   └───main
       ├───java
       ├───resources
       └───webapp
           ├───javascript
           │   ├───test.js
           │   ├───example.js
           │   └───jquery-library.js
           ├───WEB-INF
           │    └───web.xml
           └───example.jsp

My JSP pages can refer to my javascript libraries simply as

<script src=javascript/jquery-library.js></script>

There is no need for any special configuration.

edited Jan 8, 2016 at 19:31

Raja Anbazhagan

4,5941 gold badge49 silver badges68 bronze badges

answered Jun 20, 2014 at 20:19

Kemin Zhou

6,9913 gold badges54 silver badges60 bronze badges

Comments

Raghuram · Accepted Answer · 2011-10-21 06:24:39Z

4

org.springframework.web.servlet.PageNotFound - No mapping found for HTTP request with URI [/appname/css/myStyles.css] in DispatcherServlet

This indicates a configuration problem with your web.xml/spring context file. DispatcherServlet should not be processing a request for a css resource.

If this does not help troubleshoot the problem, you may want to post relevant snippets of your web.xml and spring context file.

answered Oct 21, 2011 at 6:24

Raghuram

52.8k11 gold badges114 silver badges124 bronze badges

Comments

nanselm2 · Accepted Answer · 2020-01-08 13:49:11Z

0

From this answer, from @Mario - It depends on the packaging.

If your Maven project is WAR - put it in the webapp directory. You can choose to use subfolders within the webapp directory ie: webapp/css/main.css or put the file directly within the webapp directory ie: webapp/main.css.

If you are using JAR, put in the resources directory. As Viratoro@ mentions above, there is some configuration required to map the resources directory.

answered Jan 8, 2020 at 13:49

nanselm2

1,50712 silver badges12 bronze badges

Comments

Kenton · Accepted Answer · 2020-08-10 00:37:46Z

0

The best solution I found for this problem is to use Java Configuration

@Configuration
 @EnableWebMvc
 public class WebAppConfig implements WebMvcConfigurer {
     
    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        
    registry.addResourceHandler("/resources/**").addResourceLocations("/resources/");
    }
}

answered Aug 10, 2020 at 0:37

Kenton

312 bronze badges

Collectives™ on Stack Overflow

Where do CSS and JavaScript files go in a Maven web app project?

First Attempt

Second Attempt

Third Attempt

5 Answers 5

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

First Attempt

Second Attempt

Third Attempt

5 Answers 5

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related