javascript - How to add custom CSS/JS to Grails 2.4.x layouts/templates? -
grails 2.4.5 here, believe (correct me if i'm wrong) asset-pipeline plugin default/desired method managing css/js resources.
i have custom css/js files included on large subset of gsp pages, , wondering how add them:
- using
asset-pipelineplugin; but... - in such way can (somehow) reference them
grails-app/views/layouts/special.gsp, , referencespecial.gsplayout inside each desired gsp page.
so again, desired functionality is:
grails-app/views/layouts/special.gsp: ------------------------------------- <!doctype html> <html> <head> <title><g:layouttitle default="my app!"/></title> <asset:stylesheet src="my-custom.css"/> <g:layouthead/> </head> <body> <g:layoutbody/> <asset:javascript src="my-custom.js"/> </body> </html> and then, in gsp page want use layout, add <meta name="layout" content="special"> in <header> tag normal.
how can use asset-pipeline , layouts in concert each other? place my-custom.css , my-custom.js? special instructions here?
if leave special.gsp as-is:
- you place
my-custom.csswithingrails-app\assets\stylesheetsfolder - you place
my-custom.jswithingrails-app\assets\javascriptsfolder
depending on ide, assets folder may @ top-level , fact located within grails-app may abstracted. instance, using 'project explorer' view within ggts, there assets folder directly under project.
with asset-pipeline, include these files within 'parent' file syntax:
//= my-custom.js or
/* *= require my-custom.css */ this 'parent' file though need included within layout have done.
additional info:
mentioned require_self , require_tree in comment below, i'll go further detail use.
require_self
mylayout.gsp
<asset:javascript src="myparent.js"/>
myparent.js
//= mycustom.js //= require_self console.log("this code runs because of require_self , after mycustom.js"); mycustom.js
console.log("my require_self optional because i'm not using asset-pipeline."); the require_self used include js/css exists within particular file; required files using asset-pipeline import other js/css files. optional when file strictly js/css has been imported. reason can use asset-pipeline import files haven't modified (jquery.js example), otherwise need place require_self within files.
require_tree
directory structure
grails-app/assets/ | +--javascripts/ | | | +--js-parent.js | | | +--mycustomjs | | | +--script1.js | | | +--script1.js | +--stylesheets/ | +--css-parent.css | +--mycustomcss | +--sheet1.css | +--sheet2.css | +--sheet3.css mylayout.gsp
<asset:javascript src="js-parent.js"/> <asset:stylesheet src="css-parent.css"/> js-parent.js
//= require_tree mycustomjs csss-parent.css
/* *= require_tree mycustomcss */ there go, have 3 css files , 2 js files pulled in using parents , require_tree syntax.
Comments
Post a Comment