PrimeFaces和JQuery:资源排序 [英] PrimeFaces and JQuery: resource ordering
问题描述
我对JQuery导入的顺序有疑问. 在头部，我这样做:
I have a problem with the order of JQuery imports. In the head section I do:
<h:head>
<f:facet name="first">
<h:outputScript library="primefaces" name="jquery/jquery.js" target="head" />
</f:facet>
<f:facet name="middle">
<h:outputScript library="primefaces" name="jquery/jquery-plugins.js" target="head" />
</f:facet>
...
第一次加载我的页面时，一切似乎都正确，尤其是jquery/jquery-plugins命令:
The first time my page is loaded everything seems correct, especially the jquery/jquery-plugins order:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"><head id="j_idt2">
<link type="text/css" rel="stylesheet" href="/installateurportal/javax.faces.resource/theme.css.jsf?ln=primefaces-aristo" />
<link type="text/css" rel="stylesheet" href="/installateurportal/javax.faces.resource/components.css.jsf?ln=primefaces&v=6.0" />
<link type="text/css" rel="stylesheet" href="/installateurportal/javax.faces.resource/css/default/core.css.jsf?ln=bsf" />
<link type="text/css" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />
<link type="text/css" rel="stylesheet" href="/installateurportal/javax.faces.resource/css/bsf.css.jsf?ln=bsf" />
<!--[if lt IE 9]><script src="/installateurportal/javax.faces.resource/js/html5shiv.js.jsf?ln=bsf"></script><script src="/installateurportal/javax.faces.resource/js/respond.js.jsf?ln=bsf"></script><![endif]-->
<script type="text/javascript" src="/installateurportal/javax.faces.resource/jquery/jquery.js.jsf?ln=primefaces&v=6.0"></script>
<script type="text/javascript" src="/installateurportal/javax.faces.resource/jquery/jquery-plugins.js.jsf?ln=primefaces&v=6.0"></script>
<script type="text/javascript" src="/installateurportal/javax.faces.resource/core.js.jsf?ln=primefaces&v=6.0"></script>
...
页面上有类似的按钮
<h:commandLink styleClass="btn btn-mini btn-default"
actionListener="#{testController['filterTable']}">
<i class="fa fa-refresh"/>
</h:commandLink>
按下其中之一后，页面再次加载，并且在JS-Console中出现错误，例如
After pressing one of them the page is loaded again with errors in JS-Console like
Uncaught ReferenceError: jQuery is not defined
at tbmDisposition-aendernPF.jsf:3
VM219 jquery-plugins.js.jsf?ln=primefaces&v=6.0:5 Uncaught ReferenceError: jQuery is not defined
at VM219 jquery-plugins.js.jsf?ln=primefaces&v=6.0:5
at VM219 jquery-plugins.js.jsf?ln=primefaces&v=6.0:5
当您查看生成的html时:
And when you look at the generated html:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"><head id="j_idt2">
<link type="text/css" rel="stylesheet" href="/installateurportal/javax.faces.resource/theme.css.jsf?ln=primefaces-aristo" />
<link type="text/css" rel="stylesheet" href="/installateurportal/javax.faces.resource/css/default/core.css.jsf?ln=bsf" />
<link type="text/css" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />
<link type="text/css" rel="stylesheet" href="/installateurportal/javax.faces.resource/css/bsf.css.jsf?ln=bsf" />
<!--[if lt IE 9]><script src="/installateurportal/javax.faces.resource/js/html5shiv.js.jsf?ln=bsf"></script><script src="/installateurportal/javax.faces.resource/js/respond.js.jsf?ln=bsf"></script><![endif]-->
<link type="text/css" rel="stylesheet" href="/installateurportal/javax.faces.resource/components.css.jsf?ln=primefaces&v=6.0" />
<script type="text/javascript" src="/installateurportal/javax.faces.resource/jquery/jquery-plugins.js.jsf?ln=primefaces&v=6.0"></script>
<script type="text/javascript" src="/installateurportal/javax.faces.resource/jquery/jquery.js.jsf?ln=primefaces&v=6.0"></script>
<script type="text/javascript" src="/installateurportal/javax.faces.resource/core.js.jsf?ln=primefaces&v=6.0"></script>
...
您会发现jquery-plugins位于之上 jquery，会导致所描述的错误.
You can see that jquery-plugins is above jquery which causes the described error.
当然，我在开头部分尝试了各种替代方法，但均未成功，因此，我们将不胜感激.
Of course I tried various alternatives in the head section without success, so any help would be appreciated.
版本信息
PrimeFacs:6.0
PrimeFacs: 6.0
JSF:1.2_15-jbossorg-2
JSF: 1.2_15-jbossorg-2
服务器:jboss-as-7.1.2.Final
Server: jboss-as-7.1.2.Final
问候 凯
更新: 调试HeadRenderer我发现HeadRenderer似乎根本不负责JQuery. 它必须与Widget的ResourceDependencies及其呈现方式有关. 有谁知道哪个渲染器可能负责ResourceDependencies?
Update: Debugging the HeadRenderer I found out that the HeadRenderer doesn't seem to be responsible for JQuery at all. It must have something to do with ResourceDependencies of the Widget and how they are rendered. Does anyone know which renderer might be responsible for ResourceDependencies?
更新2: 此外，我正在使用BootsFaces进行布局.现在，我了解到BootsFaces也具有自己的JQuery和资源优化...
Update 2: Besides I am using BootsFaces for the layout. Now I learned that BootsFaces has its own JQuery and resource optimization as well ...
更新3: 在BootsFaces的ResourceFileComparator中，JS文件将被重命名为
Update 3: In the ResourceFileComparator of BootsFaces the JS files will be renamed like
if (name.contains("jquery-ui")) name = "2.js"; // make it the second JS file
else if (name.contains("jquery")) name = "1.js"; // make it the first JS file
但是在我的情况下，jquery-ui的名称是:"jquery/jquery-plugins.js" =>"jquery/jquery.js"和"jquery/jquery-plugins.js"都将重命名为"1.js"
But in my case the name for jquery-ui is: "jquery/jquery-plugins.js" => Both "jquery/jquery.js" and "jquery/jquery-plugins.js" will be renamed to "1.js"
推荐答案
我在BootsFaces-OSP( https://github.com/TheCoder4eu/BootsFaces-OSP/issues/640 )，并找到了解决方法(在问题中进行了介绍). 所以现在对我有用.
I started an issue at BootsFaces-OSP (https://github.com/TheCoder4eu/BootsFaces-OSP/issues/640) and found a workaround (described in the issue). So now it works for me.
这篇关于PrimeFaces和JQuery:资源排序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
