The JSF <h:outputStylesheet>
, <h:outputScript>
and <h:graphicImage>
components have a library
attribute. What is this and how should this be used? There are a lot of examples on the web which use it as follows with the common content/file type css
, js
and img
(or image
) as library name depending on the tag used:
<h:outputStylesheet library="css" name="style.css" />
<h:outputScript library="js" name="script.js" />
<h:graphicImage library="img" name="logo.png" />
How is it useful? The library
value in those examples seems to be just repeating whatever is already been represented by the tag name. For a <h:outputStylesheet>
it’s based on the tag name already obvious that it represents a “CSS library”. What’s the difference with the following which also just works the same way?
<h:outputStylesheet name="css/style.css" />
<h:outputScript name="js/script.js" />
<h:graphicImage name="img/logo.png" />
Also, the generated HTML output is a bit different. Given a context path of /contextname
and FacesServlet
mapping on an URL pattern of *.xhtml
, the former generates the following HTML with the library name as request parameter:
<link rel="stylesheet" type="text/css" href="https://stackoverflow.com/contextname/javax.faces.resource/style.css.xhtml?ln=css" />
<script type="text/javascript" src="/contextname/javax.faces.resource/script.js.xhtml?ln=js"></script>
<img src="/contextname/javax.faces.resource/logo.png.xhtml?ln=img" alt="" />
While the latter generates the following HTML with the library name just in the path of the URI:
<link rel="stylesheet" type="text/css" href="https://stackoverflow.com/contextname/javax.faces.resource/css/style.css.xhtml" />
<script type="text/javascript" src="/contextname/javax.faces.resource/js/script.js.xhtml"></script>
<img src="/contextname/javax.faces.resource/img/logo.png.xhtml" alt="" />
The latter approach makes in hindsight also more sense than the former approach. How exactly is the library
attribute then useful?