20130123-Grails手工增加资源文件

概述

现在富客户端应用,页面代码中会引入大量的js、css文件,如,bootstrap、jquery-ui、knockout等,使用Grails的插件机制比较麻烦,首先得看有没有已经写好的插件,如果没有还要自己去写。如果有,还要看版本是否一致,如果想用新版本的资源文件,还没有插件,比较费劲。所以,可以使用Grails的resource机制,直接引入需要的资源文件即可。如果文件太大,还可以使用jawr plugin压缩一下,比较方便。

资源引入

1、在web-app目录中新建一个static目录,用来存放资源文件

2、打开ApplicationResource.groovy,根据存放路径引入资源,资源的引用还可以使用依赖的方式定义引入最小单位的资源文件,具体怎么设置可以参考Grails的指南

 1 modules = {    
 2     bootstrap {
 3         resource url:'static/bootstrap/js/bootstrap.js'
 4         resource url:'static/bootstrap/css/bootstrap.css'
 5         resource url:'static/bootstrap/css/bootstrap-responsive.css'
 6     }
 7     
 8     jquery {
 9         resource url:'static/jqueryui/js/jquery-1.9.0.js'
10     }
11     
12     jqueryui {
13         resource url:'static/jqueryui/js/jquery-ui-1.10.0.custom.js'
14     }
15     
16     dataTables {
17         resource url:'static/dataTables/js/jquery.dataTables.js'
18     }
19 }

资源使用

这里将所有资源文件直接引入所有页面,打开main.gsp文件,在<head></head>中登记资源名称即可

1         <g:javascript library="jquery"/>
2         <g:javascript library="jqueryui"/>
3         <g:javascript library="bootstrap"/>
4         <g:javascript library="dataTables"/>

 再简单一点的办法,直接在页面中引用

1、把资源文件拷贝到web-app目录

2、根据需要直接引用,引用方法如下

 

<link rel="stylesheet" href="${resource(dir: 'css', file: 'bootstrap.min.css')}" type="text/css">
<link rel="stylesheet" href="${resource(dir: 'css', file: 'bootstrap-responsive.min.css')}" type="text/css">

<script type="text/javascript" src="${resource(dir:'js',file:'jquery.min.js')}"></script>
<script type="text/javascript" src="${resource(dir:'js',file:'jquery.ui.custom.js')}"></script>
<script type="text/javascript" src="${resource(dir:'js',file:'bootstrap.min.js')}"></script>

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值