One or more resources has the target of 'head' but not 'head' component has been defined within the view

This means that you're using plain HTML <head> instead of JSF <h:head> in your XHTML template. The JSF <h:head> allows automatic inclusion of CSS/JS resources in the generated HTML <head> via @ResourceDependency annotations. PrimeFaces as being a jQuery based JSF component library needs to auto-include some jQuery/UI JS/CSS files and this really requires a <h:head>.

So, search for a

<head>
    <title>Some title</title>
    ...
</head>

in your templates and replace it by

<h:head>
    <title>Some title</title>
    ...
</h:head>

See also:

  • What's the difference between <h:head> and <head> in Java Facelets?
  • Unable to understand <h:head> behaviour
  • How to programmatically add JS and CSS resources to <h:head>?
  • How to include another XHTML in XHTML using JSF 2.0 Facelets?

Thank you for your useful answer, the JS/CSS/Jquery script are added when using H:HEAD, below are the generated HTML page :

1- using <head> tag

<head>
    <title>TODO supply a title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>

2- using <h:head> tag

<head><link type="text/css" rel="stylesheet" href="/PrimefacesExamples  /face/javax.faces.resource/theme.css?ln=primefaces-aristo" />
  <link type="text/css" rel="stylesheet" href="/PrimefacesExamples/faces/javax.faces.resource/primefaces.css?ln=primefaces&amp;v=4.0" />
  <script type="text/javascript" src="/PrimefacesExamples/faces/javax.faces.resource/jquery/jquery.js?ln=primefaces&amp;v=4.0"></script>
  <script type="text/javascript" src="/PrimefacesExamples/faces/javax.faces.resource/jquery/jquery-plugins.js?ln=primefaces&amp;v=4.0"></script>
  <script type="text/javascript" src="/PrimefacesExamples/faces/javax.faces.resource/primefaces.js?ln=primefaces&amp;v=4.0"></script>
<title>TODO supply a title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>