使用 Grails Asset-Pipeline 将 JavaScript 置于底层
Posted
技术标签:
【中文标题】使用 Grails Asset-Pipeline 将 JavaScript 置于底层【英文标题】：Put JavaScript at the Bottom with Grails Asset-Pipeline 【发布时间】：2015-03-15 06:21:35 【问题描述】：通过 Grails 资源插件，您可以使用如下 gsp 布局：
<!DOCTYPE html>
<html>
<head>
<g:layoutHead/>
<r:layoutResources />
</head>
<body>
<g:layoutBody/>
<g:javascript library="jquery" plugin="jquery" />
<r:layoutResources />
</body>
使用r:layoutResources 标签可以指定资源应该包含在JQuery 之后的页面底部，它位于布局gsp 的底部。
有没有办法对资产管道插件做同样的事情？ JQuery包含后如何将资源放在文档事件的底部？
【问题讨论】：
【参考方案1】：在你的布局文件中，输入：
<html>
<body>
....
<!-- Your layout scripts -->
<asset:javascript src="app.js"/>
<!-- Custom placeholder for page scripts -->
<g:ifPageProperty name="page.footScripts">
<g:pageProperty name="page.footScripts" />
</g:ifPageProperty>
</body>
</html>
并在您的页面（即 index.gsp ）中，放入此
<html>
<body>
...
...
</body>
</html>
<content tag="footScripts">
<asset:javascript src="jqueryui/jquery-ui.min"/>
</content>
这样，您可以使用在各个页面中定义的内容来扩展您的布局。
Grails 3 documentation ( though the same in Grails 2 )
参见章节 8.2.6 Sitemesh 内容块
【讨论】：
【参考方案2】：如果你想在你的子脚本上添加多个脚本，你可以这样做
你的parent.gsp底部
<g:each in="$pageScript">
<asset:javascript src="$it.value.js"/>
</g:each>
你的child.gsp
<g:set var="pageScript" value="['script1, script2']"/>
【讨论】：
这感觉更像我用过的所有其他模板引擎。【参考方案3】：我只是在 .gsp 或布局文件的底部添加行：
<asset:stylesheet src="xxx.css"/>
<asset:javascript src="xxx.js"/>
xxx.js 和 xxx.css 可以包含一个清单以加载更多内容。
您将通过清单加载 JQuery：
xxx.js:
//= require jquery
//= require select2.min.js
//= require_self
【讨论】：
当你将它添加到你的布局文件中时，这将不起作用，因为布局中的 JQuery 将包含在 xxx.js 之后。 它对我有用。我将 JQuery 内容包含在application.js 调用的清单中，该调用在我的布局 .gsp 的 <head> 中列出。我也认为您可以在 xxx 清单中添加 JQuery。
我不喜欢这个解决方案。
@confile 有什么理由支持您不喜欢该解决方案吗？
在资源插件中也可以做到这一点。您可以定义 jQuery 模块并定制一个新模块 dependsOn jQuery 模块。我看不出为什么不使用答案中显示的方式。 @配置文件【参考方案4】：
无论你使用什么插件，你都可以用<g:pageProperty/>标签解决这个问题（反正我和你一样用asset-pipeline测试了这个解决方案）。
解决方案的教程在这里：http://mythinkpond.com/2014/02/02/grails-adding-javascript-bottom-page/
【讨论】：
以上是关于使用 Grails Asset-Pipeline 将 JavaScript 置于底层的主要内容，如果未能解决你的问题，请参考以下文章
带有 3rd 方库的 Grails Asset-Pipeline 系统